Javascript - Changing the forms action parameter before you submit it

[m0l0ko]

I have a form where you enter some info like categories into it then PHP gets entries from a MySQL database. I need to store the search criteria in URL variables though, so I was thinking I'll just add them into the forms action parameter (i.e. <form action="form.php?category=cat&urlvar2=var">) so I have to change the action parameter on the fly.

I'm relatively new to javascript so I can't figure it out. I tried this:

Code: [Select]

function update_form() {
   
    var form_action = document.getElementById("search_form").getAttribute("action");

    var cat = document.getElementById('cat');
    var var2 = document.getElementById('var2');

    form_action = form_action + '?cat=' + cat + '&var2=' +var2;
   
    alert(form_action);

}
and along with this form tag:

Code: [Select]

    <form action="index.php" method="post" id="search_form" name="search_form" onsubmit="return update_form()">

And when the alert box comes up, it displays the correct action parameter (i.e. index.php?cat=cat1&var2=var) but when it submits the form, it just directs you to index.php, without adding the URL parameters.

Like I said, I'm new to javascript so I'm stuck. I tried a couple of other approaches which didn't work. I'm guessing the problem is that the form is already submitted before this script changes the value of the action parameter. Is there a way I can return the form as false, but make it resubmit the form and return true the second time?

[relax]

why not add hidden input boxes insted and fetch them with  $_POST[] ?
to get/set the value by js use document.getElementById('cat').value


also you can make the submit button an only click button and call a function and at the end call submit from javascript


theres also an easier way to do all this with jquery

[m0l0ko]

All the fields are inside the form tag so I can fetch them with $_POST anyway, the reason I want to throw in URL variables is cuz I wanted to make it so you could also get stuff out of the DB without having to post the info through the form. I dunno what the hell I was thinking though, all I need to do is keep the search form part of the site and browsing part separate.

BTW I tried the button thing you mentioned, I put in a button that doesn't submit the form, instead it calls a javascript function and at the end, the javascript function submits the form. It didn't submit it with the updated action for some reason. Ah well, I'll just use another approach, thanks for the help anyway.

[relax]

have you checked jquery or js XMLhttprequest?
ajax can fetch data and jquery change it easily on the fly