简体   繁体   中英

how to preselect select tag's option using javascript

I have a form which contains select tag, I want to prefill that tag after clicking on button on the previous page. how can I do this? here's the form code:

<form method="post" name="registration" action="http://esafe.urdemo.net/user/login/signup" onsubmit="return checkform2();">

                                <input type="text" class="textbox"  placeholder="Enter First Name"   name="first_name" /> 

                               <input type="text" class="textbox"   placeholder="Enter Middle Name" name="middle_name" />

                               <input type="text" class="textbox"  placeholder="Enter Last Name" name="last_name" />

                               <input type="text" class="textbox"  placeholder="Select Date dd/mm/yyyy"  name="Date1" onblur="return checkdob(this);"/>

                               <input type="text" class="textbox"  placeholder="Enter Email Id" name="email" />

                               <input type="text" class="textbox"  placeholder="Enter Mobile No." name="mobile" />

                               <select name="plan" class="form-control"  style="width:90%">
                                    <option value="" selected="selected">Please Select</option>
                                    <option value="1">Pro</option>
                                    <option value="2">Premium</option>
                                    <option value="3">Elite</option>
                                    <option value="4">Magna</option>
                               </select>
 <div class="signinStrip">
  <span class="forgot"> <a href="#" id="resend_password_link"></a> </span>
   <input class="signin_submit" value="Submit" type="submit" />
    </div>
    </form>

here's the button's code

 <tr>
     <td class="title">&nbsp;</td>
     <td><p class="bottom"><a class="btn btn-primary" href="#" >Buy Now</a></p></td>
     <td><p class="bottom"><a class="btn btn-primary" href="#" >Buy Now</a></p></td>
     <td><p class="bottom"><a class="btn btn-primary" href="#" >Buy Now</a></p></td>
     <td><p class="bottom"><a class="btn btn-primary" href="#" >Buy Now</a></p></td>

    </tr>

If you want to select particular option based on button clicked on previous page then you have to send that value via some server side variable or via address url param. for eg. your second page url has to be something like " http://yourdomain.com/page2?selected_value=temp "

Then in next page javascript you have to extract this param

function getParam(paramName) {
  return decodeURI(
    (RegExp(paramName + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
  );
} 
var selectedVal = getParam("elected_value");
document.getElementById(<your select box id>).value = selectedVal;​​​​​​​​​​

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM