javascript - Copy AJAX Control Toolkit CascadingDropDown on client -


i'd copy cascading dropdownlist on client side via javascript (jquery).

cascading drowndown lists

you can see in first box cascading dropdown lists replicate. rendered in asp.net cascadingdropdown control of ajax control toolkit. works perfectly.

when click on "add additional category" dropdownlists of firstbox copied. (see second box)

this click script action (using clone() of jquery):

categoryrow.clone(true, true).insertbefore(containerrow); subcategory1row.clone(true, true).insertbefore(containerrow); subcategory2row.clone(true, true).insertbefore(containerrow); subcategory3row.clone(true, true).insertbefore(containerrow);

the clone() function copies hidden clientstate field of cascadingdropdown control.

unfortunately cascading functionality of copied cascadingdropdownlists not work.

how can best create/copy cascading drodwownlists? or have other ideas/better ways this?

"unfortunately cascading functionality of copied cascadingdropdownlists not work"

that because original elements registered event listeners... copied elements indeed copied but, without listeners.

how can check it? in modern browser (i preffer chrome) can watch elements of html page when entering development tools (hit f12 on). each element has map of active listeners.

element event listeners shown in chrome development tools

in short: find function used define events in first place original elements - use function register new copied elements.

just make sure not register original elements more once. cause each event fire several times each element.


Comments

Post a Comment

Popular posts from this blog

javascript - Jquery show_hide, what to add in order to make the page scroll to the bottom of the hidden field once button is clicked -

i have button on website when clicked, reveals map. button can seen when page first loads up, when clicked, section holding map slides open , goes out of screen since page loads @ top (normal). want page scroll down bottom of div select when button pushed, if map out of screen. if page scrolled down, , clicks show map button, don't want page jump bottom of map. i tried figure out myself, no luck. seasoned jquery coders able give me guidance? many thanks! map = mapdiv.gmap3("get"); infobox = new infobox({ pixeloffset: new google.maps.size(-220, -310), closeboxurl: '', enableeventpropagation: true }); mapdiv.delegate('.infobox .close','click',function () { infobox.close(); }); jquery(".slidingdiv").hide(); jquery(".show_hide").show(); jquery('.show_hide').click(function(){ lastcenter=map.getcenter(); jquery(".slidingdiv&quo
Read more

javascript - Highcharts multi-color line -

Image
i looking create highchart multi-colored line. if goes down under value, become red, , when comes on value, become green . here picture example: or maybe highcharts have other charts models differentiate high or low level color? you can achieve coloring using lineargradient coloring: color: { lineargradient: { x1: 0, x2: 0, y1: 0, y2: 1 }, stops: [ [0, 'red'], [0.25, 'yellow'], [0.50, 'green'], [0.75, 'yellow'], [1, 'red'] ] } here 0 in stops relates minimum value of series , 1 maximum value, , in between percentages between values. if find percentages according values prior creating chart use correct stops values make relate specific values in data (at least approximately). see this jsfiddle example .
Read more

javascript - Enter key does not work in search box -

tried search guys sorry. input in search box doesnt work (or search) when hit enter when user clicks search button. doing wrong? here code. thanks. <script type="text/javascript"> $(document).ready(function() { $("#submit").click(function() { var url = "http://asla.org/awardssearch.html"; url += "?s=" + $('#googlecse').val(); window.location = url; }); $('#googlecse').keydown(function(event) { if (event.keycode == '13') { $("#submit").click(); } else { //do nothing :) } }); }); </script> <form class="navbar-form navbar-right" role="search"> <div class="search"> <input id="googlecse" type="text" onblur="if(this.value=='')this.value=this.defaultvalue;" onfocus="if(this.value==this.defaultvalue)t
Read more