Bootstrap: Active Class

In bootstrap, the active class is used to get the selected switch value. When the switch is clicked by the active class, the label of this button is added. After sending the form value, the switch with the active label is sent for further processing.

However, when the active class is added from jquery and the form is submitted , it does not publish / receive the value of this button. To do this, I have to simulate a click on the switch with the active class.

  • Am I doing something wrong?
  • Is there any other way to achieve this?

    <?php
        $value = 1;
        ?>
        <html>
        <head lang="en">
      <meta charset="UTF-8">
    <title></title>
    <script src="js/jquery-2.1.4.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <script>
    
     function showOption() {
        $(document).ready(function () {
    
       $('#option_grp input[value=<?php echo "$value"?>]').parent('label').addClass('active').click();
    
            });
        }
    </script>
    </head>
     <body onload="showOption()">
     <div class="container">
    
    <form method="post" action="getValue.php">
    
    
            <div id="option_grp" class="btn-group" data-toggle="buttons">
                <label class="btn btn-primary">
                <input type="radio" name="pr_type" value="1">Option 1
                </label>
                <label class="btn btn-primary">
                <input type="radio" name="pr_type" value="2">Option 2
                </label>
    
              </div>
    
            <input type="submit" name="submit" value="Submit">
    
     </form>
    </div>
    </body>
    </html>
    

getValue.php

    $pr_type=$_POST['pr_type'];
    echo "pr_type : ".$pr_type;
+4
source share
1 answer

POST, "". .

:

  • , , .
  • , , "checked" "checked". . .

, . , , . Bootstrap "active" , , , .

+1

Source: https://habr.com/ru/post/1612108/


All Articles