I have this tag on my site

<div id="ad-car-detail-content"> </div>

in which the content is loaded using this script

 <script type="text/javascript" charset="utf-8" src="http://avtousta.ucoz.com/js/board/add-cars-board.js"></script>

together it turns out like this.

 <div id="ad-car-detail-content"> </div> <script type="text/javascript"> $("select#car_model_id").change( function() { var str = ""; $("select#car_model_id option:selected").each( function() { str += $(this).text() + " "; }); $("input#bdF1").val(str); }).change(); </script> <script type="text/javascript"> $("select.car_Marka") .on("change", function() { var selected_option = $("select.car_Marka option:selected"); $("input.catSelector9") .attr("id", selected_option.attr("id")) .attr("value", selected_option.attr("value")); }); </script> <script type="text/javascript" charset="utf-8" src="http://avtousta.ucoz.com/js/board/add-cars-board.js"></script>

When choosing any type of car in Avtomobil tipi in Bütün Markalar when choosing a brand of car instead of Marka secin , the value in INPUT 0 should change to INPUT VALUE and INPUT ID of the selected car brand.

In Model secin, when selecting an auto model, the INPUT 0 value should change to the INPUT VALUE of the selected OPTION element. For example, we chose <OPTION>w202</OPTION> The INPUT VALUE value should be like this: <input value="w202"> But for some reason, the VALUE and ID values ​​do not change with this load.

And if I take the whole code and paste it on the page, like this, then it works.

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <div id="ad-cars-detail-id" class="ad-cars-detail-right"> <div id="ad-car-detail-content"> <form method="post" id="addEntForm" style="margin:0px" name="addform" enctype="multipart/form-data" action="http://avtousta.ucoz.com/board" onsubmit="openery();return false;"> <input type="hidden" name="jkd498" value="1"> <input type="hidden" name="jkd428" value="1"> <div class="manTable" id="bdM64"> <div class="ad-cars-detail-right"> <div id="ad-car-detail-content"> <input type="hidden" name="jkd498" value="1"> <input type="hidden" name="jkd428" value="1"> <div class="manTable" id="bdM64"> <div id="bdM49"> <div class="manTd2" id="bdM51"> <select id="bdF18" class="manFlFlt1" name="filter1" onchange="fillMark();"> <option id="bdM50" value="0">Avtomobil: Tipi</option> <option value="1">Minik avtomobilləri</option> <option value="2">Minik avtomobilləri kommersiya</option> <option value="3">Yük Avtomobilləri</option> <option value="4">Avtobuslar</option> <option value="5">Qoşqu dartanlar</option> <option value="6">Qoşqular</option> <option value="7">Çıxarıla bilinən kuzalar</option> <option value="8">Motoskletlər</option> <option value="9">Baggilər</option> <option value="10">Skuterlər</option> <option value="11">Moto yolsuzluq</option> <option value="12">Karting</option> <option value="13">Yolsuzluq moto amfibi</option> <option value="14">Yolsuzluq Qar üçün</option> </select> </div> </div> <div id="bdM61"> <div class="manTd2" id="bdM63"> <input class="catSelector9" checked="checked" type="button" value="90001" name="ocat" id="cus90001"> <div id="car_mark"> <select class="car_Marka" id="car_Marka" onchange="fillModel();"> <option id="0" value="0">Marka: Seçin</option> <option value="90001" id="cus90001">AC</option> <option value="90002" id="cus90002">Acura</option> <option value="90003" id="cus90003">Adler</option> <option value="90004" id="cus90004">Alfa Romeo</option> <option value="90005" id="cus90005">Alpina</option> <option value="90006" id="cus90006">Alpine</option> <option value="90007" id="cus90007">AM General</option> <option value="90008" id="cus90008">AMC</option> <option value="90009" id="cus90009">Ariel</option> <option value="90010" id="cus90010">Aro</option> <option value="90011" id="cus90011">Asia</option> <option value="90012" id="cus90012">Aston Martin</option> <option value="90013" id="cus90013">Audi</option> <option value="90014" id="cus90014">Austin</option> <option value="90015" id="cus90015">Autobianchi</option> <option value="90016" id="cus90016">Baltijas Dzips</option> <option value="90017" id="cus90017">Beijing</option> <option value="90018" id="cus90018">Bentley</option> <option value="90019" id="cus90019">Bertone</option> <option value="90020" id="cus90020">Bitter</option> <option value="90021" id="cus90021">BMW</option> <option value="90022" id="cus90022">Borgward</option> <option value="90023" id="cus90023">Brabus</option> <option value="90024" id="cus90024">Brilliance</option> <option value="90025" id="cus90025">Bristol</option> <option value="90026" id="cus90026">Bufori</option> <option value="90027" id="cus90027">Bugatti</option> <option value="90028" id="cus90028">Buick</option> <option value="90029" id="cus90029">BYD</option> <option value="90030" id="cus90030">Byvin</option> <option value="90031" id="cus90031">Cadillac</option> <option value="90032" id="cus90032">Callaway</option> <option value="90033" id="cus90033">Carbodies</option> <option value="90034" id="cus90034">Caterham</option> <option value="90035" id="cus90035">Changan</option> <option value="90036" id="cus90036">ChangFeng</option> <option value="90037" id="cus90037">Chery</option> <option value="90038" id="cus90038">Chevrolet</option> <option value="90039" id="cus90039">Chrysler</option> <option value="90040" id="cus90040">Citroen</option> <option value="90041" id="cus90041">Cizeta</option> <option value="90042" id="cus90042">Coggiola</option> <option value="90043" id="cus90043">Dacia</option> <option value="90044" id="cus90044">Dadi</option> <option value="90045" id="cus90045">Daewoo</option> <option value="90046" id="cus90046">DAF</option> <option value="90047" id="cus90047">Daihatsu</option> <option value="90048" id="cus90048">Daimler</option> <option value="90049" id="cus90049">Datsun</option> <option value="90050" id="cus90050">De Tomaso</option> <option value="90051" id="cus90051">DeLorean</option> <option value="90052" id="cus90052">Derways</option> <option value="90053" id="cus90053">DeSoto</option> <option value="90054" id="cus90054">Dodge</option> <option value="90055" id="cus90055">DongFeng</option> <option value="90056" id="cus90056">Doninvest</option> <option value="90057" id="cus90057">Donkervoort</option> <option value="90058" id="cus90058">DS</option> <option value="90059" id="cus90059">E-Car</option> <option value="90060" id="cus90060">Eagle</option> <option value="90061" id="cus90061">Eagle Cars</option> <option value="90062" id="cus90062">Ecomotors</option> <option value="90063" id="cus90063">FAW</option> <option value="90064" id="cus90064">Ferrari</option> <option value="90065" id="cus90065">Fiat</option> <option value="90066" id="cus90066">Fisker</option> <option value="90067" id="cus90067">Ford</option> <option value="90068" id="cus90068">Foton</option> <option value="90069" id="cus90069">FSO</option> <option value="90070" id="cus90070">Fuqi</option> <option value="90071" id="cus90071">Geely</option> <option value="90072" id="cus90072">Geo</option> <option value="90073" id="cus90073">GMC</option> <option value="90074" id="cus90074">Gonow</option> <option value="90075" id="cus90075">Gordon</option> <option value="90076" id="cus90076">Great Wall</option> <option value="90077" id="cus90077">Hafei</option> <option value="90078" id="cus90078">Haima</option> <option value="90079" id="cus90079">Haval</option> <option value="90080" id="cus90080">Hawtai</option> <option value="90081" id="cus90081">Hindustan</option> <option value="90082" id="cus90082">Holden</option> <option value="90083" id="cus90083">Honda</option> <option value="90084" id="cus90084">HuangHai</option> <option value="90085" id="cus90085">Hummer</option> <option value="90086" id="cus90086">Hyundai</option> <option value="90087" id="cus90087">Infiniti</option> <option value="90088" id="cus90088">Innocenti</option> <option value="90089" id="cus90089">Invicta</option> <option value="90090" id="cus90090">Iran Khodro</option> <option value="90091" id="cus90091">Isdera</option> <option value="90092" id="cus90092">Isuzu</option> <option value="90093" id="cus90093">IVECO</option> <option value="90094" id="cus90094">JAC</option> <option value="90095" id="cus90095">Jaguar</option> <option value="90096" id="cus90096">Jeep</option> <option value="90097" id="cus90097">Jensen</option> <option value="90098" id="cus90098">JMC</option> <option value="90099" id="cus90099">Kia</option> <option value="90100" id="cus90100">Koenigsegg</option> <option value="90101" id="cus90101">KTM</option> <option value="90102" id="cus90102">Lamborghini</option> <option value="90103" id="cus90103">Lancia</option> <option value="90104" id="cus90104">Land Rover</option> <option value="90105" id="cus90105">Landwind</option> <option value="90106" id="cus90106">Lexus</option> <option value="90107" id="cus90107">Liebao Motor</option> <option value="90108" id="cus90108">Lifan</option> <option value="90109" id="cus90109">Lincoln</option> <option value="90110" id="cus90110">Lotus</option> <option value="90111" id="cus90111">LTI</option> <option value="90112" id="cus90112">Luxgen</option> <option value="90113" id="cus90113">Mahindra</option> <option value="90114" id="cus90114">Marcos</option> <option value="90115" id="cus90115">Marlin</option> <option value="90116" id="cus90116">Marussia</option> <option value="90117" id="cus90117">Maruti</option> <option value="90118" id="cus90118">Maserati</option> <option value="90119" id="cus90119">Maybach</option> <option value="90120" id="cus90120">Mazda</option> <option value="90121" id="cus90121">McLaren</option> <option value="90122" id="cus90122">Mega</option> <option value="90123" id="cus90123">Mercedes-Benz</option> <option value="90124" id="cus90124">Mercury</option> <option value="90125" id="cus90125">Metrocab</option> <option value="90126" id="cus90126">MG</option> <option value="90127" id="cus90127">Microcar</option> <option value="90128" id="cus90128">Minelli</option> <option value="90129" id="cus90129">MINI</option> <option value="90130" id="cus90130">Mitsubishi</option> <option value="90131" id="cus90131">Mitsuoka</option> <option value="90132" id="cus90132">Morgan</option> <option value="90133" id="cus90133">Morris</option> <option value="90134" id="cus90134">Nissan</option> <option value="90135" id="cus90135">Noble</option> <option value="90136" id="cus90136">Oldsmobile</option> <option value="90137" id="cus90137">Opel</option> <option value="90138" id="cus90138">Osca</option> <option value="90139" id="cus90139">Packard</option> <option value="90140" id="cus90140">Pagani</option> <option value="90141" id="cus90141">Panoz</option> <option value="90142" id="cus90142">Perodua</option> <option value="90143" id="cus90143">Peugeot</option> <option value="90144" id="cus90144">PGO</option> <option value="90145" id="cus90145">Piaggio</option> <option value="90146" id="cus90146">Plymouth</option> <option value="90147" id="cus90147">Pontiac</option> <option value="90148" id="cus90148">Porsche</option> <option value="90149" id="cus90149">Premier</option> <option value="90150" id="cus90150">Proton</option> <option value="90151" id="cus90151">PUCH</option> <option value="90152" id="cus90152">Puma</option> <option value="90153" id="cus90153">Qoros</option> <option value="90154" id="cus90154">Qvale</option> <option value="90155" id="cus90155">Ravon</option> <option value="90156" id="cus90156">Reliant</option> <option value="90157" id="cus90157">Renaissance</option> <option value="90158" id="cus90158">Renault</option> <option value="90160" id="cus90160">Rezvani</option> <option value="90161" id="cus90161">Rimac</option> <option value="90162" id="cus90162">Rolls-Royce</option> <option value="90163" id="cus90163">Ronart</option> <option value="90164" id="cus90164">Rover</option> <option value="90165" id="cus90165">Saab</option> <option value="90166" id="cus90166">Saleen</option> <option value="90167" id="cus90167">Santana</option> <option value="90168" id="cus90168">Saturn</option> <option value="90169" id="cus90169">Renault Samsung</option> <option value="90170" id="cus90170">SEAT</option> <option value="90171" id="cus90171">ShuangHuan</option> <option value="90172" id="cus90172">Skoda</option> <option value="90173" id="cus90173">Smart</option> <option value="90174" id="cus90174">Soueast</option> <option value="90175" id="cus90175">Spectre</option> <option value="90176" id="cus90176">Spyker</option> <option value="90177" id="cus90177">SsangYong</option> <option value="90178" id="cus90178">Subaru</option> <option value="90179" id="cus90179">Suzuki</option> <option value="90180" id="cus90180">Talbot</option> <option value="90181" id="cus90181">TATA</option> <option value="90182" id="cus90182">Tatra</option> <option value="90183" id="cus90183">Tazzari</option> <option value="90184" id="cus90184">Tesla</option> <option value="90185" id="cus90185">Tianma</option> <option value="90186" id="cus90186">Tianye</option> <option value="90187" id="cus90187">Tofas</option> <option value="90188" id="cus90188">Toyota</option> <option value="90189" id="cus90189">Trabant</option> <option value="90190" id="cus90190">Tramontana</option> <option value="90191" id="cus90191">Triumph</option> <option value="90192" id="cus90192">TVR</option> <option value="90193" id="cus90193">Ultima</option> <option value="90194" id="cus90194">Vauxhall</option> <option value="90195" id="cus90195">Vector</option> <option value="90196" id="cus90196">Venturi</option> <option value="90197" id="cus90197">Volkswagen</option> <option value="90198" id="cus90198">Volvo</option> <option value="90199" id="cus90199">Vortex</option> <option value="90200" id="cus90200">W Motors</option> <option value="90201" id="cus90201">Wartburg</option> <option value="90202" id="cus90202">Westfield</option> <option value="90203" id="cus90203">Wiesmann</option> <option value="90204" id="cus90204">Willys</option> <option value="90205" id="cus90205">Xin Kai</option> <option value="90206" id="cus90206">Zastava</option> <option value="90207" id="cus90207">Zenos</option> <option value="90208" id="cus90208">Zenvo</option> <option value="90209" id="cus90209">Zotye</option> <option value="90210" id="cus90210">ZX</option> <option value="90211" id="cus90211">Avtokam</option> <option value="90212" id="cus90212">Astro</option> <option value="90213" id="cus90213">Bronto</option> <option value="90214" id="cus90214">VAZ (Lada)</option> <option value="90215" id="cus90215">QAZ</option> <option value="90216" id="cus90216">YO-Mobil</option> <option value="90217" id="cus90217">ZAZ</option> <option value="90218" id="cus90218">ZİL</option> <option value="90219" id="cus90219">ZİS</option> <option value="90220" id="cus90220">İJ</option> <option value="90221" id="cus90221">KaMaz</option> <option value="90222" id="cus90222">Kanonir</option> <option value="90223" id="cus90223">Kombat</option> <option value="90224" id="cus90224">LuAZ</option> <option value="90225" id="cus90225">Moskviç</option> <option value="90226" id="cus90226">SeAZ</option> <option value="90227" id="cus90227">SMZ</option> <option value="90228" id="cus90228">TaqAZ</option> <option value="90229" id="cus90229">UAZ</option> <option value="90230" id="cus90230">Eksklyuziv</option> </select> </div> </div> </div> <div id="bdM5"> <div id="car_model"> <select id="car_model_id"> <option value="0">Model: Seçin</option> <option value="10001">378 GT Zagato</option> <option value="10002">ACE</option> <option value="10003">Aceca</option> <option value="10004">Cobra</option> <option value="10001">378 GT Zagato</option> <option value="10002">ACE</option> <option value="10003">Aceca</option> <option value="10004">Cobra</option> </select> </div> <input value="378 GT Zagato " type="button" id="bdF1" name="title"> </div> <input type="hidden" name="a" value="12"> <input type="hidden" name="ssid" value="Yats5PDJ"> <input type="hidden" id="numi" value="1"> </div> </div> <script type="text/javascript"> $("select#car_model_id").change( function() { var str = ""; $("select#car_model_id option:selected").each( function() { str += $(this).text() + " "; }); $("input#bdF1").val(str); }).change(); </script> <script type="text/javascript"> $("select.car_Marka") .on("change", function() { var selected_option = $("select.car_Marka option:selected"); $("input.catSelector9") .attr("id", selected_option.attr("id")) .attr("value", selected_option.attr("value")); }); </script> </div> </div></form> <div id="bdM65"> <div class="manTdBut" id="bdM66"> </div> </div> <input type="hidden" name="a" value="12"> <input type="hidden" name="ssid" value="Yats5PDJ"> <input type="hidden" id="numi" value="1"> </div> </div>

  • I understand that there is some code that is loading late. and the script function does not see it, is it possible to write functions without jquery or something else? - Samir Mamedov

1 answer 1

The fact is that the markup in the form is formed completely dynamically and at first, until nothing is selected in the first select , the rest do not even have id and class attributes to attach the necessary handlers. Not to mention the data itself.

If you somehow “catch” the moment of data loading and execute the following function:

 function test() { $("select#car_model_id").change( function() { var str = ""; $("select#car_model_id option:selected").each( function() { str += $(this).text() + " "; }); $("input#bdF1").val(str); }).change(); $("select.car_Marka") .on("change", function() { var selected_option = $("select.car_Marka option:selected"); $("input.catSelector9") .attr("id", selected_option.attr("id")) .attr("value", selected_option.attr("value")); }); }

Everything starts to work fine. Attach handlers when loading data can be, for example, as follows.

  $("document").ready(function(){ $("#ad-car-detail-content").one("change",function(){ test(); document.getElementById("car_mark").setAttribute("onchange","test()"); }); });

Of course, this solution is inherently a “crutch”, but at least it can solve the problem with the widget that you are using.

  • Thanks a lot! everything works fine. 5 +++ - Samir Mamedov