Add tag in angular form send value as null
<ng-select [items]="[]" [addTag]="true" [multiple]="true" bindLabel="name" bindValue="value" [(ngModel)]="applicable-to-status-codes" [closeOnSelect]="false" formControlName="applicable-to-status-codes"></ng-select>
{{formGroup.value | json }}
<ng-select [items]="[]" [addTag]="true" [multiple]="true" bindLabel="name" bindValue="value" [(ngModel)]="applicable-to-status-codes" [closeOnSelect]="false" formControlName="applicable-to-status-codes"></ng-select>
You forget to add closing double quotation on bindValue="value" make sure, you are following the syntax accordingly.
Related
I am having an issue when triggering the click handler in my button here. The error comes back as TypeError: Cannot read property 'discountProduct' of null when I click the button. I know for a fact that this.discountProduct.id has a value by inspecting it from the Vue Tools and by knowing that the button is rendering to begin with since it only conditionally shows if the id > 1.
I alternatively tried to remove this but it still throws the same error.
I also tried manually just inserting the product id as the param and that works so I am not sure what the issue is at this point.
<button v-if="this.discountProduct.id >= 1"
type="button"
v-on:click="addToCart(this.discountProduct.id, true)"
Is you button in the <template> tags?
If so, you do not need to use this delete from the click argument and v-if. However that should only throw a warning.
Can you also post the code for the method addToCart?
If you are not setting the full discountProduct object you will need to make sure setting the id is reactive. Like the example below:
this.$set(this.discountProduct, 'id', 1)
Nested Object/keys are not reactive without using $set. See https://v2.vuejs.org/v2/guide/reactivity.html for more details.
Hope this helps
I have a custom component called 'menu-entry':
<menu-entry v-for="field in fields" :id:"field.id" :ref="field.id" v-bind:key="field.id" v-bind:class="[classArray]" v-bind:field="field" v-on:clicked="menuEntryClicked">
</menu-entry>
I need to get one of them (for example field.id = 2) and remove an item from the classArray.
this.$refs[2] is working for HTML elements, but not for custom elements.
this.$el.querySelector isnt working either.
is there another way to remove an item from the classArray of a specific element?
Your question it is not clear but you are trying to set id and ref to field.id so following this logic it is not necessary to do though.
You can just send the id to the method you are executing like below:
<menu-entry
v-for="field in fields"
v-bind:key="field.id"
v-bind:class="[classArray]"
v-bind:field="field"
v-on:clicked="menuEntryClicked(field.id)" // <= send the id here
>
</menu-entry>
I am not sure if i helped but regarding your question, now you can figoure out which id of element is clicked and remove it from classArray or whatever you want
2 is not a valid id selector when you use document.querySelector('#2'); maybe you can use document.getElementById('2') instead - it can work.
I'm using Vuejs for frontend and I have blade template displayed using iframe. I want to send data into blade such that Whatever i type inside text field it should be displayed on the laravel blade template.
<iframe :src="template" #load="onTemplateLoad()"></iframe>
and template is defined as
this.template = '/templates/email_templates/' + t.id + '?footer_message=' + this.footer_message;
If there is any new line character in footer_message it should be displayed. Now it is ignoring the new line. Is there any way to solve it.
Anyway friends I got it, before appending the value just replace all new line character with '%0A'.
In my code I added this message.replace(/\n/g, '%0A');. Which Works fine.
How to use a css selector wildcard if the id values keep changing?
<td role="gridcell" style="text-align:center;" title="**Edit** | Copy</a" aria-describedby="list4_action">Edit | Copy</td>
This is in a table where the id # 12374 changes for every new row . I was looking for selenium to click the EDIT button .
When i use cssSelector:a[href*='/mac1/notication/edit?$id='*] the test is failing with the message
Caused by: org.openqa.selenium.InvalidSelectorException: The given selector a[href*='/mac/notication/edit?$id='*] is either invalid or does not result in a WebElement. The following error occurred:
InvalidSelectorError: An invalid or illegal selector was specified
You are correct in using the CSS3 [attribute*=value] Selector.
However, you have a typo in your CSS Selector (you spelled notification wrong) and you've included an unnecessary $ character. Try this:
a[href*='/mac1/notification/edit?id=']
Essentially, this CSS Selector will search for an <a> tag with an href attribute containing the string /mac1/notification/edit?id=.
Try with the following CSS selector,
a[href^='/mac1/notification/edit?id=']
This was a little tricky as the UI page and table were coded differently.
Hence had look for the value of the JQGrid since it is a table. Then check for the value 'Edit' in the table and the pass the Click id. The id I was using was the correct one except that just using that id was not working.
The id that was used was alert.edit=cssSelector:a[href*='/mac1/Notification/edit?id=']
I made a template and there is a <select dojotype="dijit.form.ComboBox" dojoAttachPoint="selectPageNumber" id="selectPageNumber">tag with id and dojoAttachPoint be "selectPageNumber". I want to populate it with options upon create so I add some code to the postCreate function:
var select = dijit.byId("selectPageNumber");
or
var select = this.selectPageNumber;
but I always have select being undefined.
What am I doing wrong?
UPD:
The problem with element has been solved spontaneously and I didn't got the solution. I used neither dojo.addOnLoad nor widgetsInTemplate : true, it just started to work. But I have found the same problem again: when I added another tag I can't get it!
HTML:
<select class="ctrl2" dojotype="dijit.form.ComboBox" dojoAttachPoint="selectPageNumber" id="selectPageNumber">
</select>
<select class="ctrl2" dojotype="dijit.form.ComboBox" dojoAttachPoint="selectPageNumber2" id="selectPageNumber2">
</select>
widget:
alert(this.selectPageNumber);
alert(this.selectPageNumber2);
first alert shows that this.selectPageNumber is a valid object and the this.selectPageNumber2 is null.
widgetsInTemplate is set to false.
all the code is within dojo.addOnLoad()
dojo.require() is valid
I am using IBM Rational Application Developer (if it is essential).
WHY it is so different?
Based on your syntax, I am assuming that you are using 1.6. Your question mentions template and postCreate, so i am assuming that you have created a widget that acts as a composite (widgets in the template).
Assuming 1.6, in your widget, have you set the widgetsInTemplate property to true. This will tell the parser that your template has widgets that need to be parsed when creating the widget.
http://dojotoolkit.org/documentation/tutorials/1.6/templated/
I would remove the id from the select. Having the id means that you can only instantiate your widget once per page. You should use this.selectPageNumber within your widget to access the select widget.
If you are using 1.7 or greater, instead of setting the widgets widgetsInTemplate property, you should use the dijit._WidgetsInTemplateMixin mixin.
http://dojotoolkit.org/reference-guide/1.8/dijit/_WidgetsInTemplateMixin.html
Depending on when dijit.byId() is being called, the widget may not have been created yet. Try using dojo.addOnLoad()
dojo.addOnLoad(function() {
var select = dijit.byId("selectPageNumber");
});
I came close to the solution: it seems like there is a some sort of RAD "caching" that doesn't respond to changes made in html code.
Ways to purge the workspace environment with RAD (based on Eclipse) might be a solution.