Kendo dropdownlist in ajax application - kendo-ui

I have an ajax application that returns html including a element. I can give it an id and I am trying to grab it to make it into kendo dropdownlist.
But whatever I try putting the code before or after the ajax result I cannot transform my ajax element into a dropdown.
$jq(document).ready(function(){
$jq("#myselect").kendoDropDownList();
});
Any ideas how to se this with ajax generated elements?
Regards
KArel

remove document.ready event and then add this code $jq("#myselect").kendoDropDownList();
in the call back function of your intial ajax call where HTML is returned. if still not working, please create a JSFiddle soluction and post the link here.

Use the success callback of your Ajax request to initialize your 'element'. Also make sure that your 'element' is input or select html element.

Related

How to load datatable on change of dropdown

I have a view where there is a dropdown and datatable.
At initial load, I am loading the values to be loaded in the datatable based on the first select of dropdown and on change of dropdown, I want to fetch data based on that condition and populate those data on the datatable.
Please anyone suggest a way to do this!
I am trying a way using get request but it is reloading the page and hence I am unable to make the data persist in the datatable.
I followed exactly this https://laracasts.com/discuss/channels/laravel/filtering-data-using-drop-down-onchange-event
Data is coming and populates to the datatable but just after a second, it reloads and comes to old data in datatable.
Please either correct my or suggest some new way to do it!
After debugging, I found that in one of the js file included, there were a code
$(document).ajaxStop(function() {
window.location.reload();
});
Since, this code was making it to reload on every ajax call completes, I faced this issue.

Hide the Partial view and show another partial view in mvc3

I have a hyperlink column in the grid. On clicking the link i have to hide the partialview(grid section) and have to show/load another partialview which is the detail section. Please provide solution
You could use javascript. With jQuery that will correspond to the .toggle() function or the .show()/.hide() functions. So basically you will subscribe to the click event of the link and inside this handler show and hide the respective sections. For this to work you should obviously place those partials inside placeholder divs so that you could show/hide the entire placeholder.
If in addition to showing the partial you need to fetch some fresh information from the server then you could use AJAX to request a controller action that will return the fresh data of the partial view that you will inject into the DOM at the correct placeholder location. In order to send an AJAX request in jQuery you could use the $.ajax() function or directly the .load() function.

Event to sort by a column

I've a <p:datatable> with sortable columns. I would like obtaining the event when click on header in any column.
Any idea?
What Primefaces version?? Maybe it would be for the best to create two different primefaces tags (2 and 3)...
About your solution...you know that DataTable has built-in support for ajax sorting. Means that every sort would be an ajax request, so you could intercept this ajax call. A solution to do that would be to implement an ajax status component that on start, or on complete to call a javascript function or a server side method...
Here you can find the ajax status: http://www.primefaces.org/showcase-labs/ui/ajaxStatusHome.jsf

MVC3 - repopulate dropdownlist with Ajax after modal form submit

I'm building an MVC3 application and would like to have a form with a dropdown list, and if the option the user requires is not there, then they can click on a link to open a modal popup box, fill a different form out, submit it and close the form, and repopulate the dropdown list which will contain the option they have just added.
I've looked at options of using either jQuery Ajax or MVC Ajax (e.g. Ajax.BeginForm, Ajax.ActionLink). Can anyone recommend the best one to use, and also point me in the direction of a good tutorial? Been having a good look today but can't find anything that really does what I'm looking for.
Thanks
I typically use jQuery in these situations. In this case I would use .ajax() post to perform the form's action. I would then add a handler in the .ajax()'s success event to add my new item to the dropdown using append, example minus all properties except for success handler:
$.ajax({
success: function() {$(myDropDown).append(theNewListItem);}
});
You can generate theNewListItem by having it created and returned from the server in the ajax call, or simly build it using the current form values, assuming the values have been validated.

Can we create a ajax form within a fieldset of another form?

Is this possible?
The ajax form's purpose is to serve as a selector for the main form.
Forms cannot be nested.
Btw, you don't need a form for that purpose. Just send AJAX request without any form.
Put a select/set of radio buttons outside the form, assign onchange handler and in it do whatever you want. For example - send AJAX query and modify the form.

Resources