Home/ Questions/Q 3349498
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T01:40:19+00:00

I have a product selection page where you choose a plan and once selected

  • 0

I have a product selection page where you choose a plan and once selected it displays the selection information in a div. The problem is if the page gets refreshed the summary div disappears but it remembers your form selection. How can I get it so it still remembers the summary as well?

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.min.js"></script>

</head>
<body>
<script>
$(document).ready(function(){
      $("div.plan").hide();

      $("input[type=radio]").click(function(){
          $("div.plan").hide();
          $("div[planid=" + $(this).val() +"]").show();
      });
});
</script>

<input type="radio" name="plan" value="1" /> Plan 1 <br />
<input type="radio" name="plan" value="2" /> Plan 2 <br />
<input type="radio" name="plan" value="3" /> Plan 3 <br />

<div class="plan" planid="1">Plan 1 details</div>
<div class="plan" planid="2">Plan 2 details</div>
<div class="plan" planid="3">Plan 3 details</div>

</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    After your code abode, you can trigger the click handler on the selected radio button, like this:

    $(document).ready(function(){
  $("div.plan").hide();

  $("input[type=radio]").click(function(){
      $("div.plan").hide();
      $("div[planid=" + $(this).val() +"]").show();
  }).filter(':checked').click();
});

    What this does is uses the handler you’re already binding, then from those elements gets the :checked one and executes the click event handler, showing the proper <div>.

    As an aside, planid isn’t a valid attribute, if you’re doing down this road go ahead and use data- attributes so you’ll be HTML5 valid as you go (they present no problems in HTML4).

    • 0