add data into selectfild with ajax

[ragtek]

i have a selectfield:

<form action="musikcp.php" method="get">
<select name="kategorie">
<option value="1" class="" selected="selected">kategorie1</option>
<option value="2" class="" >123</option>
<option value="3" class="" >123</option>
<option value="4" class="" >mein test</option>
<option value="5" class="" >123</option>
<option value="6" class="" >23</option>
<option value="7" class="" >23</option>
</select></form>

and a form:

<div class="vbmenu_popup" id="neuekat_menu" style="display:none">
<form action="musikcp.php" method="post">
<table width="200px"><tr><td class="alt2">Name:
<input type="text" name="katname" />
<input type="hidden" name="do" value="dokat" />
<input type="submit" value="speichern" /></td></tr></table></form>
</div>

how can i add the new cat wich i input throu the form to the select part without reloading the site?

[CDarklock]

You need to use JavaScript for this, but it's not really obvious how to do it. Here's a barebones set of code that works.

<script>
   function Test(parm)
   {
      if(parm!='') // always check your parameters.
      {
         var opt = document.createElement("option"); // create an option object
         opt.text = parm; // set the text of that object to the text provided
         document.forms[0].elements['sel'].add(opt); // add it to the end of the select object
      }
      else alert("Enter a category first!"); // Or "enterzie einen kategorie bitte" or whatever
   }
</script>

This code assumes the FIRST form in your document has a select element named "sel":

<form>
   <select name="sel">
      <option>First</option>
      <option>Second</option>
      <option>Third</option>
      <option>Fourth</option>
      <option>Fifth</option>
   </select>
</form>

The second form in your document in turn has an action calling the desired function with the appropriate parameter:

<form action="javascript:Test(document.forms[1].elements['cat'].value);">
   <input name="cat">
   <input type="submit">
</form>

I have only tested this code in IE7... because now that I've said that, everyone with Firefox and Opera will immediately run off and test it in their browser, hoping it will break and make Microsoft look bad. If they don't start ringing bells and waving flags and crowing about the flaws of IE, it works in everything.

And if they're going to test it, I don't have to. So there. ;p

[Dismounted]

You have to also keep in mind that not everyone has Javascript enabled.

[ragtek]

yes, thats clear
theres a normal method available
just the js part is missing