页面在警报窗口内重新加载

Question

这是假设使用 jQuery 和 $_POST['points'] 和 echo 它在 add.php 中获取已检查收音机的 id

添加.php：

  <div class="col-md-10">
    <form role="form" method="POST">
      <div class="radio">
        <label><input type="radio" name="optradio" id="1"> Leadership </label>
        <label><input type="radio" name="optradio" id="2"> Management </label>
        <label><input type="radio" name="optradio" id="3"> Distribution </label>
      </div>

      <div>
      <?php
        if (isset($_POST['points'])) 
        {
          echo $_POST['points']." is the value";
        }
        else
          echo 'none';
      ?>
      </div>
    </form>
  </div>

Javascript：

$("input[type=radio]").on("click",function()
{
    var value=($('input[type=radio]  [name=optradio]:checked').attr('id'));

    $.post("./add.php", {points: value}, function(data)
    {
      alert(data);
    });
});

但是，每次我单击单选按钮时，它都会显示一个警报弹出窗口并重新加载整个add.php 代码INSIDE 警报弹出窗口，而不是通过$_POST['points'] 在@987654328 中回显它@。 页面回显'none' 并且$_POST['points'] 的值在警报弹出窗口中是正确的。

*注意：JS 文件已经加载

我发现它与none 相呼应，因为尚未选中/单击单选按钮。但是在我单击单选按钮后页面不会加载，但页面会在警报窗口内重新加载。

除了警报之外，我还有什么遗漏或者我应该做的吗？ 或者 是否有其他方法可以获取已检查收音机的 id？

编辑

  <div class="col-md-10">
    <form role="form" method="POST">
      <div class="radio">
      <?php
        foreach(returnFromTable($GLOBALS['table_key_area']) as $keyarea)
        {
          echo '<label><input type="radio" name="optradio" id="'.$keyarea['id'].'">'.$keyarea['description'].'&nbsp</label>';
        }
      ?>
      </div>

      <div>
      <?php
        if (isset($_POST['points'])) 
        {
          $x = $_POST['points'];
        }
        else
          echo 'none';
      ?>
      </div>
    </form>
  </div>

Answer 1

您需要更改脚本中的两件事：

1) 使用$('input[name=optradio]:checked').attr('id') 获取Id

2) 在发布请求中使用“积分”而不是积分

$("input[type=radio]").on("click",function()
  {   
      var value=($('input[name=optradio]:checked').attr('id'));

      $.post("viewport.php", {'points': value}, function(data)
      {
        alert(data);
      });
  });

Answer 2

你不需要 ajax：

<div class="col-md-10">
    <form role="form" method="POST">
      <div class="radio">
        <label><input type="radio" name="optradio" id="1"> Leadership </label>
        <label><input type="radio" name="optradio" id="2"> Management </label>
        <label><input type="radio" name="optradio" id="3"> Distribution </label>
      </div>

      <div class="result">
      none
      </div>
    </form>
  </div>

js：

$("input[type=radio]").on("click",function()
{   var value = 'none';
        value = $('input[type=radio]  [name=optradio]:checked').attr('id');
    $('.result').text(value+'is the value')
});

Answer 3

由于您使用的 $.post 调用等效于 $.ajax (type: post) 调用，因此服务器将返回与您在 url 中键入 add.php 时相同的响应。

您不必进行 ajax 调用，只需使用 javascript/jQuery 编写 id。

$("#some-text-container").text(value);

插入 this 而不是 post call。

Answer 4

请试试这个：

<?php
  if (isset($_POST['points'])) 
  {
      echo $_POST['points']." is the value";
  }
  else
          ?>
<div class="col-md-10">
    <form role="form" method="POST">
      <div class="radio">
        <label><input type="radio" name="optradio" id="1"> Leadership </label>
        <label><input type="radio" name="optradio" id="2"> Management </label>
        <label><input type="radio" name="optradio" id="3"> Distribution </label>
      </div>

      <div>
      </div>
    </form>
  </div>
<?php } ?>