We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

An help on your example


I'm trying one of your examples using toolbar:

I'd like to bind with 2-binding v-model the input textbox (searchTemplate) with a data that I'd like to insert in the script's data.
Let's say I name this variable searchData:


Your template now is:

searchTemplate: '<div class="e-input-group"><input class="e-input" type="text" placeholder="Search" /><span class="e-input-group-icon em-icons e-search"></span></div>',

If I change it like this:

searchTemplate: '<div class="e-input-group"><input class="e-input" type="text" placeholder="Search" v-model="searchData"/><span class="e-input-group-icon em-icons e-search"></span></div>',

it does not work.
Can you help me ?

2 Replies

SI Silvio June 17, 2019 08:40 PM UTC

Related to the same example,
I've tried to change "input" with "ejs-autocomplete", but the element seems not to be taken into account by VUE and the input is not displayed at all.
I'm guessing the problem is the same as for v-model.
How is it possible to put an ejs-autocomplete with v-model and datasource on the toolbar ?

VD Vinitha Devi Murugan Syncfusion Team June 18, 2019 12:25 PM UTC

Hi Silvio, 
Greetings from Syncfusion. 
In our end we rendered the templates as an individual vue component so that we can’t able to access the model value inside the template from parent component. We have prepared the workaround solution for your requirement with autoComplete control and same can be available in below link. 
Kindly try the able sample and let us know if you need further assistance on this. 
M.Vinitha devi. 

Live Chat Icon For mobile
Up arrow icon