使用带有不同操作的单选按钮发布提交

时间:2016-03-05 04:30:07

标签: jquery forms submit radio

我想使用POST(不是GET)发送信息

我有50个项目的列表,每个项目都有两个图标(单选按钮):

ITEM1

select t1.ID
, t1.ISSUE_DATE
, t1.MATURITY_DATE
, t1.AMOUNT_USD  
 FROM
    t1 
LEFT JOIN
(select a.ID
    , a.ISSUE_DATE
    , a.MATURITY_DATE
    , a.AMOUNT_USD
FROM
    t1 a
INNER JOIN
    ti b
) dupes
   on
t1.ID = dupes.ID
   WHERE dupes.ID IS NULL;

ITEM2

<label style='cursor: pointer;'>
<input type='radio' name='video' id='video' value='123ASD'/>
<img src='mp4-icon.png' width='20' align=middle style='border:0;'/>VIDEO
</label>
<label style='cursor: pointer;'>
<input type='radio' name='mp3' id='mp3' value='XYZ890'/>
<img src='mp3-icon.png' width='20' align=middle style='border:0;'/>MP3
</label>

项目3 ...

<label style='cursor: pointer;'>
<input type='radio' name='video' id='video' value='456FGH'/>
<img src='mp4-icon.png' width='20' align=middle style='border:0;'/>VIDEO
</label>
<label style='cursor: pointer;'>
<input type='radio' name='mp3' id='mp3' value='ERT234'/>
<img src='mp3-icon.png' width='20' align=middle style='border:0;'/>MP3
</label>

视频按钮必须将信息发送到video.php,如果用户按下MP3单选按钮将是mp3.php,并且信息需要采用POST方式。

我不想要一个充足的代码&lt;形式&gt;每个项目的标签。有使用jquery的解决方案吗?或者其他的东西?谢谢你的帮助。

其实我用这个:

<label style='cursor: pointer;'>
<input type='radio' name='video' id='video' value='789BNM'/>
<img src='mp4-icon.png' width='20' align=middle style='border:0;'/>VIDEO
</label>
<label style='cursor: pointer;'>
<input type='radio' name='mp3' id='mp3' value='JKL456'/>
<img src='mp3-icon.png' width='20' align=middle style='border:0;'/>MP3
</label>

但这只允许使用以下命令发送到一个操作网址

<script>
$('input[type=radio]').on('change', function() {
    $(this).closest("form").submit();
});
</script>

results showing icons

1 个答案:

答案 0 :(得分:0)

你可以在这样的每个单选按钮上放置onclick事件,它会改变表单的动作,并根据点击的按钮提交。

function change_action(name){
  var form = document.getElementById("form")
  alert(name);
  if(name =='video'){
        form.action = 'video.php';                
    }
  else{
        form.action = 'mp3.php';
    }
    form.submit();
  alert(form.action);
  
  }
<label style='cursor: pointer;'>
<input type='radio' onclick="change_action(this.name)" name='video' id='video' value='123ASD'/>
<img src='mp4-icon.png' width='20' align=middle style='border:0;'/>VIDEO
</label>
<label style='cursor: pointer;'>
<input type='radio' name='mp3'onclick="change_action(this.name)" id='mp3' value='XYZ890'/>
<img src='mp3-icon.png' width='20' align=middle style='border:0;'/>MP3
</label>


<form method="post" id="form" action="video.php">

无需加载jquery库来执行此任务。 但如果你仍然想用jquery做,你可以试试这个:

<script>
$('input[type=radio]').on('change', function() {
  if(this.name == 'video'){
     $('#form').attr('action','video.php');
  }
  else{
     $('#form').attr('action','mp3.php');
  }

     $('#form').submit();
 });
</script>