Search code examples
javascriptjqueryhtmlprototypejs

Opening popup box on the basis of selected radio button in javascript


I have 2 radio buttons of same group.

If I hit on search I want to open popup box.

Condition:

When first radio button is selected new popup box come.

When second radio button is selected new popup box come which is different from first popup. I have created code, but it is not working.

function mysearch() {


  var par = new Array();
  var form = $('mytestForm');
  var y = form.getInputs('radio', 'radioId');
  if ($('radioId1234').checked == true || $('radioId5678').checked == true) {
   
    wmGlobalObj.remErrAdvice();
    par[0] = $F(y.find(function(re) {
      return re.checked;
    }));
    if (paras[0] == '1234') 
      

      window.open('https://www.google.co.in/', 'FirstSearch', 'width=460,height=250', 'testsrch');
    else if (par[0] == "5678") 
      window.open('http://www.bing.com/', 'SecondSearch', 'width=460,height=50', 'testsrch');
    }
  } else {
    alert("error")
  }

}
<script src="https://cdnjs.cloudflare.com/ajax/libs/prototype/1.7.2/prototype.min.js"></script>
<form method="POST" id="mytestForm" name="mytestForm">
  <label for="radioId"></label>
  <input type="radio" name="radioId">
  <label class="styled" for="radioId1234">Search when First radio button is selected</label>
  <input type="radio" class="styled" name="radioId">
  <label class="styled" for="radioId567">Search when second radio button is selected</label>
  <br/>
  <br/>
  <br/>
  <a title="Lookup" id="testmine" href="mysearch()">search</a> 
</form>


Solution

  • You probably can do this alot simpler by just using CSS selectors.

    For example

    var checked_inputs = $$('form#mytestForm input[type="radio"]:checked');
    
    if(checked_inputs.length > 0)
    {
           if(checked_inputs[0].value == "1234")
           {
               window.open('https://www.google.co.in/', 'FirstSearch', 'width=460,height=250', 'testsrch');
               //this exits the foreach loop
           }
           else if(checked_inputs[0].value == "5678")
           {
               window.open('http://www.bing.com/', 'SecondSearch', 'width=460,height=50', 'testsrch');
           }
    }
    else
    {
        alert('error');
    }