Multiple web service requests from one page in html

I am trying to present three forms on one page. But I was stuck at some point. I want to check the mobile number in the first form. then use this mobile number in the final submission of the form

I tried using this in one form, but then how can I send a web request to send a security pin with Mobile Button confirmation.

I have three forms, such as

    //First Form Take Mobile Number, web service will send verification Pin as reply to this action
    <form name="PhoneVerification" action="url to phone verification web service" >
    Phone Number: <input type="text" name ="number" id="phone">
    <input type="submit" name ="submit1" id="submit1">Verify Mibile Number</input>
    </form>

//Second Form verifies pin Locally which is sent by first service
    <form name="PinVerification" action="verify pin came from previous web service">
    Verification Pin(Sent on Mobile Number): <input type="text" name ="pin" id="pin">
    <input type="submit" name ="submit2" id="submit2">Verify Pin</input>
    </form>

//Third Form Will Take Mobile Number Previously Entered. and email/password and Complete Signup
    <form action="web service call to complete signup">
    Email: <input type="text" name ="email" id="email">
    Password: <input type="text" name ="pass" id="pass">
    PasswordAgain: <input type="text" name ="passAgain" id="passAgain">
    <input type="submit" name ="submit3" id="submit3">Complete Signup</input>
    </form>

The problem is that I cannot get the value of the phone number, because the page refreshes after the form is submitted.

I read some topics about using AJAX, but how can I use Ajax in this type of situation. How can i achieve this. with AJAX or using PHP.

+4
2

cookies sessions .

javascript, cookie. w3schools

script php ajax. session.

cookies session. cookie session .

. cookies session .

+1
    Id must be unique in your html page. In above code id="phone" be present in first to forms. the second form in pinVerfication right but there is an same id = "phone" . please change it and make an another try. third form have also same problem

    //Second Form verifies pin Locally which is sent by first service
        <form name="PinVerification" action="verify pin">
        Verification Pin(Sent on Mobile Number): <input type="text" name ="number" id="pin">
        <input type="submit" name ="submit2" id="submit2">Verify Pin</input>
        </form>

/Third Form Will Take Mobile Number Previously Entered. and email/password and Complete Signup
    <form action="web service call to complete signup">
    Email: <input type="text" name ="email" id="email">
    Password: <input type="text" name ="pass" id="pass">
    PasswordAgain: <input type="text" name ="passAgain" id="passAgain">
    <input type="submit" name ="submit3" id="submit3">Complete Signup</input>
    </form>
+2

All Articles