I've got a form for updating user data that populates each input with the existing field value as it is stored in the database. However, in the case of new users, certain values haven't yet been committed to the database and so I'd like the input boxes to be blank.
In order to display the user data, I'm using Jade's interpolation functionality to look at the #{user.local} object passed in via the routes.js file.
It looks like this (snippet):
input(type="text", name="firstname", value="#{user.local.firstName}")
This works well when the property is defined, but it (correctly) inserts undefined as the text in an input where the property has not been defined.
Is there a way for me to set a variable to default to something if it hasn't been set?
Something like:
input(type="text", value="#{user.local.firstName || 'Default Text'"})
Using jade ~1.9.2, I tried
input(type='text' class='form-control' id='line6Name' name='param6' value='#{device.param6||""}')
in a form I'm writing. It gives a default of an empty string for undefined values.
I'm willing to bet the code you have there would work if you shifted where the closing double quote is.
From:
input(type="text", value="#{user.local.firstName || 'Default Text'"})
To:
input(type="text", value="#{user.local.firstName || 'Default Text'}")
Related
I am trying make a conditional select-box. There are 2 select-boxes. When select-box1 1's value changes then the 2nd select-box value automatically need to get selected to a value and it will also be disabled.
So far , i am able to do the conditional select where select-box 1's option changes value in select-box2 but it shows error in vue.
Error is--
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "value"
Also , i can disable the 2nd select-box but when i use dynamic disabled the value doesn't get set.
Question in brief:
1st selectbox has value-- a)one time payment & b)subscription and
2nd selectbox has value--a)held & b) Immediate.
Now, if 1st selectbox's subscription is selected then in the 2nd selectbox, it should be set to immediate and also get disabled.
Below is the Code Sandbox link--
https://codesandbox.io/s/conditional-select-forked-h61po?file=/src/components/HelloWorld.vue
If there is a better way of achieving this, then feel free to share ...
You don't need a ref, you can change the value of selected2 directly because it's not a prop, but a data field. Remove the reference in your component, like so:
<b-form-select
v-model="selected2"
:options="options2"
:disabled="isDisabled"
></b-form-select>
and change your onChange method to this (you don't need the else block as well):
onChange(event) {
if (event === "subscription") {
this.selected2 = "Immediate";
this.isDisabled = true;
}
},
Try it. I've tested it and it works.
I think the best way is to watch the 2-way-binding (selected) with a watcher.
See: https://v3.vuejs.org/guide/reactivity-computed-watchers.html#watch
And if the value changes you can check if the new value is 'subscription'.
And to select the wante option in the 2nd select you just have to asign the wanted value to the 2-way-binding (selected2). And for disabling set isDisabled to true.
I need to create some filters to use with v-bind and not on {{ }}. It works if the filter does character to character modifications like uppercase, lowercase, etc. But for things like trim it does't, the input value updates but not the data attached.
Here is an example (https://jsfiddle.net/3nkmjc0c/), I changed the trim to a letter change because witespace are not easy to see for test. To reproduce, just type a on the input field, the field contains aZ but the data still have a.
I don't want to use watchers because I need it in multiples inputs on different form, it would make like 15 watchers to write. The filter make it reusable. Hope you can help or give an other road to change the input value but keeping it reusable
I believe this is working correctly, just not the way you intended it to. I think this is happening in an order differently than you think.
Type in "z"
v-on:input triggers, which sets name = z
name changed, so Vue updates the value of the input box to name | trim
name | trim is equal to "zA", which displays in the input box
name itself doesn't change again until you type something
Therefore, in one case you're displaying name | trim and in another you're displaying name and wanting them to be the same.
For what it's worth, this used to work in Vue 1, but they changed it in Vue 2 with no real replacement (except computed properties).
If you're trying to just use trim, you can use the .trim modifier, like so:
<input type="text" v-model.trim="name" />
Or if you want more customization, you'll have to use a computed property:
<input type="text" v-model="trimmedName" />
computed: {
trimmedName: {
get: function() {
return this.name
},
set: function(value) {
this.name = value.trim() + "A"
}
}
}
Unfortunately, Vue doesn't support custom form modifiers for some reason, despite a lot of demand. Weigh in here if you think it's an important feature: https://github.com/vuejs/vue/issues/3666
I am using vue multiselect plugin in my Vue v.1x project. I am wondering how can I customise suggestion text like Press enter to select or Press enter to remove, when hovering over options?
You can see the example in the fiddle. I have tried with setting the :selectLabel="Select" but that didn't work.
When sending props you need to use 'kebab-case'. So if the prop looks like selectLabel in the child, it should be pass like
:select-label="value"
Also, when sending the variable make sure to either to double quotes to send as a string, since the ':' before the prop tries to evaluate a variable.
Ex. The label should be 'Select'
:select-label="'Select'"
Ex. 2. The label should use a variable 'xyz' defined in the component
:select-label="xyz"
I am writing regression tests for a web application using robot framework and the Selenium2Library library. I have a simple test which changes all of the fields of an "account settings" type form (think username, password, email, etc.), then revisits the page and makes sure all of the data was saved. Like so:
*** Test Cases ***
Sample Test
Change All Account Details
New Account Details Should Be Saved
*** Keywords ***
Change All Account Details
Navigate to Account Page
Input Text accountSettingFrom_firstname Test
Input Text accountSettingFrom_lastname Dummy
Input Text accountSettingFrom_email new_email#example.com
# etc etc, eventually save the form
New Account Details Should Be Saved
Go To ${ACCOUNT_URL}
Textfield Value Should Be accountSettingFrom_firstname Test
Textfield Value Should Be accountSettingFrom_lastname Dummy
Textfield Value Should Be accountSettingFrom_email new_email#example.com
I get the following error on the final step (Textfield Value Should Be accountSettingFrom_email new_email#example.com) when running this test: Value of text field 'accountSettingFrom_email' should have been 'new_email#example.com' but was 'None'
I have taken screenshots the moment before that step runs, and I have added a pause and manually confirmed that the value attribute of 'accountSettingFrom_email' is indeed 'new_email#example.com'. HTML of the element at time the check occurs:
<input type="email" name="accountSettingFrom[email]" value="new_email#example.com" class="foo bar" required="required" tabindex="3" maxlength="128" url="/foo/bar" userid="foobar" id="accountSettingFrom_email">
You'll notice that the first two Textfield Value Should Be keywords pass. The only difference I can discern between the three elements is that 'accountSettingFrom_email' is type="email" instead of type="text", but if the the keyword is successfully locating the element, then why can't it grab the value of the value attribute?
So am I doing something wrong? I feel like this or some similar keyword must exist to test this, without having to resort to writing a custom library.
You have hit some bugs in Selenium2Library. When Selenium2Library was created, HTML5 was not ratified. Internally the library is filtering out your element because it has a type other than 'text' (made sense before HTML5). Textfield Value Should Be can only find your element if it has tag name input and attribute value 'text' for type.
See https://github.com/robotframework/Selenium2Library/issues/546
Also due to how Textfield Value Should Be is implemented, the error you are getting makes you think the element was found when in fact it was not because it was filtered out.
See https://github.com/robotframework/Selenium2Library/issues/547
In contrast, Input Text and Input Password have never filtered on element tag or attribute.
I would try Get Element Attribute instead to get the attribute named value instead. According to the API it should be
accountSettingFrom_email#value
I am working in Ektron 8.6.
I have a FormBlock Server Control in my Template Page,It is having a DefualutFormID of a valid HTML form from workarea.The form in the workarea have got few form fields and their corresponding values.
While the template page is rendering I need to GET those form field values and re-set them with some other values.
In which Page –Cycle event I should do this coding?
I tried this code in Pre-Render Event,but I am unable to GET the value there,but I am able to set a value.
I tried SaveStateComplete event as well,no luck.
String s=FormBlock1.Fields["FirstName"].Value;
If(s=”some text”)
{
// Re-set as some other vale.
FormBlock1.Fields["FirstName"].Value=”Some other value”;
}
In which event I can write this piece of code?
Page_Load works fine for changing the value of a form field. The default behavior is for the Ektron server controls to load their data during Page_Init.
The real problem is how to get the default value. I tried every possible way I could find to get at the data defining an Ektron form (more specifically, a field's default value), and here's what I came up with. I'll admit, this is a bit of a hack, but it works.
var xml = XElement.Parse("<ekForm>" + cmsFormBlock.EkItem.Html + "</ekForm>");
var inputField = xml.Descendants("input").FirstOrDefault(i => i.Attribute("id").Value == "SampleTextField");
string defaultValue = inputField.Attribute("value").Value;
if (defaultValue == "The default value for this field is 42")
{
// do stuff here...
}
My FormBlock server control is defined on the ASPX side, nothing fancy:
<CMS:FormBlock runat="server" ID="cmsFormBlock" DynamicParameter="ekfrm"/>
And, of course, XElement requires the following using statement:
using System.Xml.Linq;
So basically, I wrap the HTML with a single root element so that it becomes valid XML. Ektron is pretty good about requiring content to be XHTML, so this should work. Naturally, this should be tested on a more complicated form before using this in production. I'd also recommend a healthy dose of defensive programming -- null checks, try/catch, etc.
Once it is parsed as XML, you can get the value property of the form field by getting the value attribute. For my sample form that I set up, the following was part of the form's HTML (EkItem.Html):
<input type="text" value="The default value for this field is 42" class="design_textfield" size="24" title="Sample Text Field" ektdesignns_name="SampleTextField" ektdesignns_caption="Sample Text Field" id="SampleTextField" ektdesignns_nodetype="element" name="SampleTextField" />