jQuery how to append under in option menu to specify itemSorting options elements alphabetically using jQueryHow do you remove all the options of a select box and then add one option and select it with jQuery?What is the best way to add options to a select from as a JS object with jQuery?How do I check if an element is hidden in jQuery?jQuery get specific option tag textHow to insert an item into an array at a specific index (JavaScript)?How can I know which radio button is selected via jQuery?How to check whether a checkbox is checked in jQuery?How can I select an element with multiple classes in jQuery?How can I refresh a page with jQuery?jQuery Get Selected Option From Dropdown
Is there a word to describe the feeling of being transfixed out of horror?
Translation of Scottish 16th century church stained glass
Can someone explain how this makes sense electrically?
A Permanent Norse Presence in America
Can I sign legal documents with a smiley face?
Indicating multiple different modes of speech (fantasy language or telepathy)
How do ground effect vehicles perform turns?
Is it possible to have a strip of cold climate in the middle of a planet?
Global amount of publications over time
Two-sided logarithm inequality
How can Trident be so inexpensive? Will it orbit Triton or just do a (slow) flyby?
Do the concepts of IP address and network interface not belong to the same layer?
Drawing ramified coverings with tikz
My friend sent me a screenshot of a transaction hash, but when I search for it I find divergent data. What happened?
Bob has never been a M before
How do I extrude a face to a single vertex
Varistor? Purpose and principle
Can somebody explain Brexit in a few child-proof sentences?
Why did the EU agree to delay the Brexit deadline?
Does having a TSA Pre-Check member in your flight reservation increase the chances that everyone gets Pre-Check?
How to align and center standalone amsmath equations?
How do I implement a file system driver driver in Linux?
How do I repair my stair bannister?
Why did the HMS Bounty go back to a time when whales are already rare?
jQuery how to append under in option menu to specify item
Sorting options elements alphabetically using jQueryHow do you remove all the options of a select box and then add one option and select it with jQuery?What is the best way to add options to a select from as a JS object with jQuery?How do I check if an element is hidden in jQuery?jQuery get specific option tag textHow to insert an item into an array at a specific index (JavaScript)?How can I know which radio button is selected via jQuery?How to check whether a checkbox is checked in jQuery?How can I select an element with multiple classes in jQuery?How can I refresh a page with jQuery?jQuery Get Selected Option From Dropdown
I have this database driven php option menu, if the page is refreshed then all option items show correctly indented.
If I add a new option item and the page is not refreshed then the new option item does not appear in option menu.
Then I write that jQuery code so that if I add a new item to the option menu, it is appended via jQuery but it is not append to correct place.
Example: If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
How can I do that, thanks.
$("#katID").change(function()
var secilitext = $("#katID option:selected").text();
var sonuc = secilitext.split(" - ");
//console.log(sonuc);
var cizgisayisi2 = (sonuc.length);
var cizgisayisi = (cizgisayisi2 - 1); //sayılar sı
var katID = $("#katID option:selected").val();
console.log("ÇİZGİ SAYISI = " + cizgisayisi2);
console.log("KAT ID = " + katID);
if (katID != 0 && cizgisayisi == 0)
cizgisayisi = 1;
console.log("cizgisayisi 1 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else if(katID == 0)
cizgisayisi = 0;
console.log("cizgisayisi 2 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else
cizgisayisi2;
console.log("cizgisayisi 3 : " + cizgisayisi2);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi2);
//.append(new Array(++cizgisayisi).join
);
$("form#SayfaYukleForm").on("submit", function(event)
event.preventDefault();
var eklenecekveri = new FormData(this);
var baslik = $('#baslik').val();
$.ajax(
url: "add to option menu.php",
method: "post",
data: eklenecekveri,
dataType: "JSON",
contentType: false,
processData: false,
success: function(sonuc)
if (sonuc.ok)
anamenukayitListe();
var son_id = sonuc.son_eklenen_id; // last_id has the last insert id
var cizgisayisi = sonuc.cizgisayisi;
$('#katID').append($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
));
$("form#SayfaYukleForm").trigger("reset");
//form yollanınca formdaki kalan verileri resetlemek temizlemek için
$("#anamenuKayitEkle").html(sonuc.ok).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.ok).fadeOut(700);
//location.reload();
, 2000);
$("#summernote").summernote("reset"); //summernote textarea alanınındaki yazıları boşalt.
else if (sonuc.hata)
$("#anamenuKayitEkle").html(sonuc.hata).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.hata).fadeOut(700);
, 2000);
,
error: function(jqXHR, exception)
console.log(jqXHR);
);
);
//kayıt ekle
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
php jquery
add a comment |
I have this database driven php option menu, if the page is refreshed then all option items show correctly indented.
If I add a new option item and the page is not refreshed then the new option item does not appear in option menu.
Then I write that jQuery code so that if I add a new item to the option menu, it is appended via jQuery but it is not append to correct place.
Example: If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
How can I do that, thanks.
$("#katID").change(function()
var secilitext = $("#katID option:selected").text();
var sonuc = secilitext.split(" - ");
//console.log(sonuc);
var cizgisayisi2 = (sonuc.length);
var cizgisayisi = (cizgisayisi2 - 1); //sayılar sı
var katID = $("#katID option:selected").val();
console.log("ÇİZGİ SAYISI = " + cizgisayisi2);
console.log("KAT ID = " + katID);
if (katID != 0 && cizgisayisi == 0)
cizgisayisi = 1;
console.log("cizgisayisi 1 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else if(katID == 0)
cizgisayisi = 0;
console.log("cizgisayisi 2 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else
cizgisayisi2;
console.log("cizgisayisi 3 : " + cizgisayisi2);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi2);
//.append(new Array(++cizgisayisi).join
);
$("form#SayfaYukleForm").on("submit", function(event)
event.preventDefault();
var eklenecekveri = new FormData(this);
var baslik = $('#baslik').val();
$.ajax(
url: "add to option menu.php",
method: "post",
data: eklenecekveri,
dataType: "JSON",
contentType: false,
processData: false,
success: function(sonuc)
if (sonuc.ok)
anamenukayitListe();
var son_id = sonuc.son_eklenen_id; // last_id has the last insert id
var cizgisayisi = sonuc.cizgisayisi;
$('#katID').append($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
));
$("form#SayfaYukleForm").trigger("reset");
//form yollanınca formdaki kalan verileri resetlemek temizlemek için
$("#anamenuKayitEkle").html(sonuc.ok).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.ok).fadeOut(700);
//location.reload();
, 2000);
$("#summernote").summernote("reset"); //summernote textarea alanınındaki yazıları boşalt.
else if (sonuc.hata)
$("#anamenuKayitEkle").html(sonuc.hata).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.hata).fadeOut(700);
, 2000);
,
error: function(jqXHR, exception)
console.log(jqXHR);
);
);
//kayıt ekle
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
php jquery
You can append at last and then can sort all options. you can check this link for sorting option: stackoverflow.com/questions/12073270/…
– Rohit Mittal
Mar 8 at 6:03
Your brackets and parenthesis in your jQuery isn't matching up.
– Qirel
Mar 8 at 6:13
i edited my question
– Dogan Ozer
Mar 8 at 7:33
if i use sort method by ids, there was different values integers is it sort to correct places as indented?
– Dogan Ozer
Mar 8 at 8:10
add a comment |
I have this database driven php option menu, if the page is refreshed then all option items show correctly indented.
If I add a new option item and the page is not refreshed then the new option item does not appear in option menu.
Then I write that jQuery code so that if I add a new item to the option menu, it is appended via jQuery but it is not append to correct place.
Example: If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
How can I do that, thanks.
$("#katID").change(function()
var secilitext = $("#katID option:selected").text();
var sonuc = secilitext.split(" - ");
//console.log(sonuc);
var cizgisayisi2 = (sonuc.length);
var cizgisayisi = (cizgisayisi2 - 1); //sayılar sı
var katID = $("#katID option:selected").val();
console.log("ÇİZGİ SAYISI = " + cizgisayisi2);
console.log("KAT ID = " + katID);
if (katID != 0 && cizgisayisi == 0)
cizgisayisi = 1;
console.log("cizgisayisi 1 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else if(katID == 0)
cizgisayisi = 0;
console.log("cizgisayisi 2 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else
cizgisayisi2;
console.log("cizgisayisi 3 : " + cizgisayisi2);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi2);
//.append(new Array(++cizgisayisi).join
);
$("form#SayfaYukleForm").on("submit", function(event)
event.preventDefault();
var eklenecekveri = new FormData(this);
var baslik = $('#baslik').val();
$.ajax(
url: "add to option menu.php",
method: "post",
data: eklenecekveri,
dataType: "JSON",
contentType: false,
processData: false,
success: function(sonuc)
if (sonuc.ok)
anamenukayitListe();
var son_id = sonuc.son_eklenen_id; // last_id has the last insert id
var cizgisayisi = sonuc.cizgisayisi;
$('#katID').append($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
));
$("form#SayfaYukleForm").trigger("reset");
//form yollanınca formdaki kalan verileri resetlemek temizlemek için
$("#anamenuKayitEkle").html(sonuc.ok).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.ok).fadeOut(700);
//location.reload();
, 2000);
$("#summernote").summernote("reset"); //summernote textarea alanınındaki yazıları boşalt.
else if (sonuc.hata)
$("#anamenuKayitEkle").html(sonuc.hata).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.hata).fadeOut(700);
, 2000);
,
error: function(jqXHR, exception)
console.log(jqXHR);
);
);
//kayıt ekle
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
php jquery
I have this database driven php option menu, if the page is refreshed then all option items show correctly indented.
If I add a new option item and the page is not refreshed then the new option item does not appear in option menu.
Then I write that jQuery code so that if I add a new item to the option menu, it is appended via jQuery but it is not append to correct place.
Example: If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
How can I do that, thanks.
$("#katID").change(function()
var secilitext = $("#katID option:selected").text();
var sonuc = secilitext.split(" - ");
//console.log(sonuc);
var cizgisayisi2 = (sonuc.length);
var cizgisayisi = (cizgisayisi2 - 1); //sayılar sı
var katID = $("#katID option:selected").val();
console.log("ÇİZGİ SAYISI = " + cizgisayisi2);
console.log("KAT ID = " + katID);
if (katID != 0 && cizgisayisi == 0)
cizgisayisi = 1;
console.log("cizgisayisi 1 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else if(katID == 0)
cizgisayisi = 0;
console.log("cizgisayisi 2 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else
cizgisayisi2;
console.log("cizgisayisi 3 : " + cizgisayisi2);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi2);
//.append(new Array(++cizgisayisi).join
);
$("form#SayfaYukleForm").on("submit", function(event)
event.preventDefault();
var eklenecekveri = new FormData(this);
var baslik = $('#baslik').val();
$.ajax(
url: "add to option menu.php",
method: "post",
data: eklenecekveri,
dataType: "JSON",
contentType: false,
processData: false,
success: function(sonuc)
if (sonuc.ok)
anamenukayitListe();
var son_id = sonuc.son_eklenen_id; // last_id has the last insert id
var cizgisayisi = sonuc.cizgisayisi;
$('#katID').append($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
));
$("form#SayfaYukleForm").trigger("reset");
//form yollanınca formdaki kalan verileri resetlemek temizlemek için
$("#anamenuKayitEkle").html(sonuc.ok).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.ok).fadeOut(700);
//location.reload();
, 2000);
$("#summernote").summernote("reset"); //summernote textarea alanınındaki yazıları boşalt.
else if (sonuc.hata)
$("#anamenuKayitEkle").html(sonuc.hata).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.hata).fadeOut(700);
, 2000);
,
error: function(jqXHR, exception)
console.log(jqXHR);
);
);
//kayıt ekle
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
$("#katID").change(function()
var secilitext = $("#katID option:selected").text();
var sonuc = secilitext.split(" - ");
//console.log(sonuc);
var cizgisayisi2 = (sonuc.length);
var cizgisayisi = (cizgisayisi2 - 1); //sayılar sı
var katID = $("#katID option:selected").val();
console.log("ÇİZGİ SAYISI = " + cizgisayisi2);
console.log("KAT ID = " + katID);
if (katID != 0 && cizgisayisi == 0)
cizgisayisi = 1;
console.log("cizgisayisi 1 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else if(katID == 0)
cizgisayisi = 0;
console.log("cizgisayisi 2 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else
cizgisayisi2;
console.log("cizgisayisi 3 : " + cizgisayisi2);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi2);
//.append(new Array(++cizgisayisi).join
);
$("form#SayfaYukleForm").on("submit", function(event)
event.preventDefault();
var eklenecekveri = new FormData(this);
var baslik = $('#baslik').val();
$.ajax(
url: "add to option menu.php",
method: "post",
data: eklenecekveri,
dataType: "JSON",
contentType: false,
processData: false,
success: function(sonuc)
if (sonuc.ok)
anamenukayitListe();
var son_id = sonuc.son_eklenen_id; // last_id has the last insert id
var cizgisayisi = sonuc.cizgisayisi;
$('#katID').append($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
));
$("form#SayfaYukleForm").trigger("reset");
//form yollanınca formdaki kalan verileri resetlemek temizlemek için
$("#anamenuKayitEkle").html(sonuc.ok).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.ok).fadeOut(700);
//location.reload();
, 2000);
$("#summernote").summernote("reset"); //summernote textarea alanınındaki yazıları boşalt.
else if (sonuc.hata)
$("#anamenuKayitEkle").html(sonuc.hata).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.hata).fadeOut(700);
, 2000);
,
error: function(jqXHR, exception)
console.log(jqXHR);
);
);
//kayıt ekle
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
$("#katID").change(function()
var secilitext = $("#katID option:selected").text();
var sonuc = secilitext.split(" - ");
//console.log(sonuc);
var cizgisayisi2 = (sonuc.length);
var cizgisayisi = (cizgisayisi2 - 1); //sayılar sı
var katID = $("#katID option:selected").val();
console.log("ÇİZGİ SAYISI = " + cizgisayisi2);
console.log("KAT ID = " + katID);
if (katID != 0 && cizgisayisi == 0)
cizgisayisi = 1;
console.log("cizgisayisi 1 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else if(katID == 0)
cizgisayisi = 0;
console.log("cizgisayisi 2 : " + cizgisayisi);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi);
else
cizgisayisi2;
console.log("cizgisayisi 3 : " + cizgisayisi2);
var gizli = $("input[name='cizgisayisi']").val(cizgisayisi2);
//.append(new Array(++cizgisayisi).join
);
$("form#SayfaYukleForm").on("submit", function(event)
event.preventDefault();
var eklenecekveri = new FormData(this);
var baslik = $('#baslik').val();
$.ajax(
url: "add to option menu.php",
method: "post",
data: eklenecekveri,
dataType: "JSON",
contentType: false,
processData: false,
success: function(sonuc)
if (sonuc.ok)
anamenukayitListe();
var son_id = sonuc.son_eklenen_id; // last_id has the last insert id
var cizgisayisi = sonuc.cizgisayisi;
$('#katID').append($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
));
$("form#SayfaYukleForm").trigger("reset");
//form yollanınca formdaki kalan verileri resetlemek temizlemek için
$("#anamenuKayitEkle").html(sonuc.ok).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.ok).fadeOut(700);
//location.reload();
, 2000);
$("#summernote").summernote("reset"); //summernote textarea alanınındaki yazıları boşalt.
else if (sonuc.hata)
$("#anamenuKayitEkle").html(sonuc.hata).fadeIn(700);
setTimeout(function()
$("#anamenuKayitEkle").html(sonuc.hata).fadeOut(700);
, 2000);
,
error: function(jqXHR, exception)
console.log(jqXHR);
);
);
//kayıt ekle
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
php jquery
php jquery
edited Mar 8 at 8:32
freedomn-m
13.2k32148
13.2k32148
asked Mar 8 at 5:58
Dogan OzerDogan Ozer
7010
7010
You can append at last and then can sort all options. you can check this link for sorting option: stackoverflow.com/questions/12073270/…
– Rohit Mittal
Mar 8 at 6:03
Your brackets and parenthesis in your jQuery isn't matching up.
– Qirel
Mar 8 at 6:13
i edited my question
– Dogan Ozer
Mar 8 at 7:33
if i use sort method by ids, there was different values integers is it sort to correct places as indented?
– Dogan Ozer
Mar 8 at 8:10
add a comment |
You can append at last and then can sort all options. you can check this link for sorting option: stackoverflow.com/questions/12073270/…
– Rohit Mittal
Mar 8 at 6:03
Your brackets and parenthesis in your jQuery isn't matching up.
– Qirel
Mar 8 at 6:13
i edited my question
– Dogan Ozer
Mar 8 at 7:33
if i use sort method by ids, there was different values integers is it sort to correct places as indented?
– Dogan Ozer
Mar 8 at 8:10
You can append at last and then can sort all options. you can check this link for sorting option: stackoverflow.com/questions/12073270/…
– Rohit Mittal
Mar 8 at 6:03
You can append at last and then can sort all options. you can check this link for sorting option: stackoverflow.com/questions/12073270/…
– Rohit Mittal
Mar 8 at 6:03
Your brackets and parenthesis in your jQuery isn't matching up.
– Qirel
Mar 8 at 6:13
Your brackets and parenthesis in your jQuery isn't matching up.
– Qirel
Mar 8 at 6:13
i edited my question
– Dogan Ozer
Mar 8 at 7:33
i edited my question
– Dogan Ozer
Mar 8 at 7:33
if i use sort method by ids, there was different values integers is it sort to correct places as indented?
– Dogan Ozer
Mar 8 at 8:10
if i use sort method by ids, there was different values integers is it sort to correct places as indented?
– Dogan Ozer
Mar 8 at 8:10
add a comment |
2 Answers
2
active
oldest
votes
If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
You currently append the new option at the bottom with:
').append($('',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Instead, use .after()
to append the new option after the selected one:
$('#katID>option:checked').after($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Example snippet:
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
If you're worried about the selected item changing during the ajax call, then you can keep a note of the selected ID and restore it, eg:
var id = $("#katID").val();
$.ajax(
...
).done(function()
$("#katID").val(id);
$("#katID>option:selected").after(...
);
or pass the "parent" ID with the ajax request and receive in the ajax response.
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
add a comment |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik" value="desktop computers ">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
<script>
var options = [];
var baslik = $('#baslik').val();
$("#katID option").each(function()
options.push([$(this).val(),$(this).text()]);
var pieces = $(this).text().split(" ");
var found = false;
$.each( pieces, function( i, val )
var pieces2 = baslik.split(" ");
$.each( pieces2, function( i, val2 )
if(val && val2 && val.toLowerCase().indexOf(val2.toLowerCase()) != -1 && !found)
options.push(["some_id"," - "+baslik]);
found = true;
return false;
)
if(found)
return false;
)
);
$('#katID') .find('option') .remove();
$.each( options, function( i, val )
$('#katID').append($('<option>',
value: val[0],
text: val[1]
))
);
</script>
Try running this code and modify your code as per you want, this code is running well for the matched elements.
i edited my question
– Dogan Ozer
Mar 8 at 7:33
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
|
show 3 more comments
Your Answer
StackExchange.ifUsing("editor", function ()
StackExchange.using("externalEditor", function ()
StackExchange.using("snippets", function ()
StackExchange.snippets.init();
);
);
, "code-snippets");
StackExchange.ready(function()
var channelOptions =
tags: "".split(" "),
id: "1"
;
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function()
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled)
StackExchange.using("snippets", function()
createEditor();
);
else
createEditor();
);
function createEditor()
StackExchange.prepareEditor(
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader:
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
,
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
);
);
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55057518%2fjquery-how-to-append-under-in-option-menu-to-specify-item%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
You currently append the new option at the bottom with:
').append($('',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Instead, use .after()
to append the new option after the selected one:
$('#katID>option:checked').after($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Example snippet:
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
If you're worried about the selected item changing during the ajax call, then you can keep a note of the selected ID and restore it, eg:
var id = $("#katID").val();
$.ajax(
...
).done(function()
$("#katID").val(id);
$("#katID>option:selected").after(...
);
or pass the "parent" ID with the ajax request and receive in the ajax response.
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
add a comment |
If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
You currently append the new option at the bottom with:
').append($('',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Instead, use .after()
to append the new option after the selected one:
$('#katID>option:checked').after($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Example snippet:
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
If you're worried about the selected item changing during the ajax call, then you can keep a note of the selected ID and restore it, eg:
var id = $("#katID").val();
$.ajax(
...
).done(function()
$("#katID").val(id);
$("#katID>option:selected").after(...
);
or pass the "parent" ID with the ajax request and receive in the ajax response.
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
add a comment |
If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
You currently append the new option at the bottom with:
').append($('',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Instead, use .after()
to append the new option after the selected one:
$('#katID>option:checked').after($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Example snippet:
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
If you're worried about the selected item changing during the ajax call, then you can keep a note of the selected ID and restore it, eg:
var id = $("#katID").val();
$.ajax(
...
).done(function()
$("#katID").val(id);
$("#katID>option:selected").after(...
);
or pass the "parent" ID with the ajax request and receive in the ajax response.
If I select COMPUTERS and if I write a text value inside the textbox as "Desktop Computers" it is appended under the option menu, but I want it to append under the COMPUTERS option value.
You currently append the new option at the bottom with:
').append($('',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Instead, use .after()
to append the new option after the selected one:
$('#katID>option:checked').after($('<option>',
value: (son_id),
text: " - ".repeat(cizgisayisi) + baslik
)
Example snippet:
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
If you're worried about the selected item changing during the ajax call, then you can keep a note of the selected ID and restore it, eg:
var id = $("#katID").val();
$.ajax(
...
).done(function()
$("#katID").val(id);
$("#katID>option:selected").after(...
);
or pass the "parent" ID with the ajax request and receive in the ajax response.
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
$("select>option:checked").after("<option value='99'>inserted</option>");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select>
<option value="1">1</option>
<option value="2">2</option>
<option value="3" selected>3</option>
<option value="4">4</option>
</select>
answered Mar 8 at 8:38
freedomn-mfreedomn-m
13.2k32148
13.2k32148
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
add a comment |
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
Thanks , it was easy but i can not see that easy method
– Dogan Ozer
Mar 8 at 9:07
add a comment |
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik" value="desktop computers ">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
<script>
var options = [];
var baslik = $('#baslik').val();
$("#katID option").each(function()
options.push([$(this).val(),$(this).text()]);
var pieces = $(this).text().split(" ");
var found = false;
$.each( pieces, function( i, val )
var pieces2 = baslik.split(" ");
$.each( pieces2, function( i, val2 )
if(val && val2 && val.toLowerCase().indexOf(val2.toLowerCase()) != -1 && !found)
options.push(["some_id"," - "+baslik]);
found = true;
return false;
)
if(found)
return false;
)
);
$('#katID') .find('option') .remove();
$.each( options, function( i, val )
$('#katID').append($('<option>',
value: val[0],
text: val[1]
))
);
</script>
Try running this code and modify your code as per you want, this code is running well for the matched elements.
i edited my question
– Dogan Ozer
Mar 8 at 7:33
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
|
show 3 more comments
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik" value="desktop computers ">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
<script>
var options = [];
var baslik = $('#baslik').val();
$("#katID option").each(function()
options.push([$(this).val(),$(this).text()]);
var pieces = $(this).text().split(" ");
var found = false;
$.each( pieces, function( i, val )
var pieces2 = baslik.split(" ");
$.each( pieces2, function( i, val2 )
if(val && val2 && val.toLowerCase().indexOf(val2.toLowerCase()) != -1 && !found)
options.push(["some_id"," - "+baslik]);
found = true;
return false;
)
if(found)
return false;
)
);
$('#katID') .find('option') .remove();
$.each( options, function( i, val )
$('#katID').append($('<option>',
value: val[0],
text: val[1]
))
);
</script>
Try running this code and modify your code as per you want, this code is running well for the matched elements.
i edited my question
– Dogan Ozer
Mar 8 at 7:33
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
|
show 3 more comments
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik" value="desktop computers ">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
<script>
var options = [];
var baslik = $('#baslik').val();
$("#katID option").each(function()
options.push([$(this).val(),$(this).text()]);
var pieces = $(this).text().split(" ");
var found = false;
$.each( pieces, function( i, val )
var pieces2 = baslik.split(" ");
$.each( pieces2, function( i, val2 )
if(val && val2 && val.toLowerCase().indexOf(val2.toLowerCase()) != -1 && !found)
options.push(["some_id"," - "+baslik]);
found = true;
return false;
)
if(found)
return false;
)
);
$('#katID') .find('option') .remove();
$.each( options, function( i, val )
$('#katID').append($('<option>',
value: val[0],
text: val[1]
))
);
</script>
Try running this code and modify your code as per you want, this code is running well for the matched elements.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" class="form-control form-control-sm" id="baslik" name="baslik" value="desktop computers ">
<select class="form-control form-control-sm" id="katID" name="katID">
<option value="">Select A Category</option>
<option value="0">TOP MENU</option>
<option value="166">ELECTRONICS</option>
<option value="167"> - COMPUTERS</option>
<option value="170"> - - DESKTOPS</option>
<option value="172"> - - - ASUS DESKTOP</option>
<option value="169"> - - NOTEBOOKS</option>
<option value="168"> - - TABLETS</option>
<option value="171"> - - - SAMSUNG TABLETS</option>
<option value="173"> - TELEVISIONS</option>
</select>
<script>
var options = [];
var baslik = $('#baslik').val();
$("#katID option").each(function()
options.push([$(this).val(),$(this).text()]);
var pieces = $(this).text().split(" ");
var found = false;
$.each( pieces, function( i, val )
var pieces2 = baslik.split(" ");
$.each( pieces2, function( i, val2 )
if(val && val2 && val.toLowerCase().indexOf(val2.toLowerCase()) != -1 && !found)
options.push(["some_id"," - "+baslik]);
found = true;
return false;
)
if(found)
return false;
)
);
$('#katID') .find('option') .remove();
$.each( options, function( i, val )
$('#katID').append($('<option>',
value: val[0],
text: val[1]
))
);
</script>
Try running this code and modify your code as per you want, this code is running well for the matched elements.
edited Mar 8 at 8:53
answered Mar 8 at 6:40
Shoyeb SheikhShoyeb Sheikh
369111
369111
i edited my question
– Dogan Ozer
Mar 8 at 7:33
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
|
show 3 more comments
i edited my question
– Dogan Ozer
Mar 8 at 7:33
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
i edited my question
– Dogan Ozer
Mar 8 at 7:33
i edited my question
– Dogan Ozer
Mar 8 at 7:33
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
I made a change.
– Shoyeb Sheikh
Mar 8 at 8:09
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
Thanks for the update but not append to option menu anything. Am ii mistake somewhere?
– Dogan Ozer
Mar 8 at 8:21
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
what variable holds the value of textbox, where is the textbox ? put the textbox in question
– Shoyeb Sheikh
Mar 8 at 8:28
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
i added textbox in my question, normaly that my codes append to iem on option menu except sorting
– Dogan Ozer
Mar 8 at 8:32
|
show 3 more comments
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f55057518%2fjquery-how-to-append-under-in-option-menu-to-specify-item%23new-answer', 'question_page');
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function ()
StackExchange.helpers.onClickDraftSave('#login-link');
);
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
You can append at last and then can sort all options. you can check this link for sorting option: stackoverflow.com/questions/12073270/…
– Rohit Mittal
Mar 8 at 6:03
Your brackets and parenthesis in your jQuery isn't matching up.
– Qirel
Mar 8 at 6:13
i edited my question
– Dogan Ozer
Mar 8 at 7:33
if i use sort method by ids, there was different values integers is it sort to correct places as indented?
– Dogan Ozer
Mar 8 at 8:10