Skip to content Skip to sidebar Skip to footer
Home / Action / Button / Html / Textbox

One Textbox One Button Two Different Pages In Html

Post a Comment
i am trying to assign a textbox value to a php variable now problem is i want one button to work for two different pages i.e if i enter in a text box 'a'and click on button it shou

Solution 1:

You can change the action onsubmit based on the text inside the input.

<html><head><scripttype="text/javascript">functiononsubmit_handler(){
            var myForm = document.getElementById('myForm');
            var data = document.getElementById('data').value;
            if(data == "a")
                myForm.setAttribute('action', 'a.php');
            elseif(data == "b")
                myForm.setAttribute('action', 'b.php');
            else
                myForm.setAttribute('action', 'error.php');
        }
    </script></head><body><h3>Enter Text:</h3><formid="myForm"method="post"onsubmit="onsubmit_handler()"><inputtype="text"id="data"name="data"value=""><inputtype="submit"value="Post"></form></body></html>

Test code here : http://jsfiddle.net/Eg9S4/

Solution 2:

use this codes buddy

<html><head><metacharset="UTF-8" /><script>functionsubmitForm()
{
    var link=document.getElementById('a');
var str1 = "a.php";
var n = str1.localeCompare(link);

if(n==1)
{
    window.open("main.html");

}

elseif(n==-1)
{
    window.open("index.html");
}
} 



</script></head><body ><h3><fontface="verdana"size="3"><b>Enter Text:</b></h3><inputtype="text"align="right"style="font-size:15pt;height:32px;"><br><br><inputtype="submit"onclick="submitForm()"value="TRY"name="a"></form></form></body></html>

Solution 3:

The problem looks to be that you're using getElementById but the input elements don't have an ID (they only have a name).

I'd also recommend attaching an onSubmit event to the form and removing the onClick events from the buttons.

Edit: After looking at the code in detail I saw that there were some other issues that were probably hindering the opersation. The most notable one was that you can't nest form tags. There were some other CSS and validation issues.

Here is some working code:

Test Page 

functionSubmitForm(el) {

        // Get the form element so that we can set the action latervar form = document.getElementById('theForm');


        // Set the action for the form based on which button was clickedif (el.id == "A")
            form.action = "a.php";

        if (el.id == "B")
            form.action = "b.php";

        // You dont need to submit the form. It's alreasdy happening, so there is no need for an explicit call.
    }

</script>


<h3style="font-family: Verdana; font-weight: bold;">Enter Text:</h3><inputtype="text"style="font-size:15pt;height:32px;"><br><br><formmethod="post"onsubmit="SubmitForm();"action="fake.html"id="theForm"><inputtype="submit"id="A"value="A"onclick="SubmitForm(this);"><inputtype="submit"id="B"value="B"onclick="SubmitForm(this);"></form>

Post a Comment for "One Textbox One Button Two Different Pages In Html"