将输入字段中的值附加到自定义href参数

时间:2013-10-19 18:25:25

标签: javascript php jquery

我正在使用下面的代码从我的数据库中获取一些数据。此外,代码通过ajax调用从mysql中删除记录。正如您在每个输入字段中看到的,我有一个保存按钮和一个删除按钮。我通过a href从每条记录发送一个唯一的ID。

现在我想要的是将自定义变量传递给我的保存按钮的href。我的意思是在每个href我添加了值cvalue =“”。

如何从中获取输入值并将其附加到此cvalue =“此处我想要输入字段中的值”

请记住,我有很多记录..

<ol class="update">
<?php
$ss = mysql_query ("SELECT * FROM users_channels WHERE u_id='$uid'");
while($chann = mysql_fetch_assoc($ss)) {
echo'              
<li>
<input name="channelName" type="text" id="channelName" style="float:left; width:300px; border:1px solid #CCC;" value="'.$chann['channel_name'].'" />
<a href="#" id="'.$chann['id'].'" class="delete_button"><span id="rcolor">Delete</span></a>
<a href="#" id="'.$chann['id'].'" cvalue="'.$chann['channel_name'].'" class="save_button"><span id="gcolor">Save</span></a>
</li>';
}
?>
</ol>

和Jquery代码:

$(document).ready(function() {

$(function() {
$(".save_button").click(function() {
var id = $(this).attr("id");
var cvalue = $("#channelName").val();
var dataStringe = 'id='+ id + '&cvalue='+ cvalue;
var parent = $(this).parent();


alert(curval);

$.ajax({
   type: "POST",
   url: "update_channel.php",
   data: dataStringe,
   cache: false,

   beforeSend: function()
   {
   parent.animate({'backgroundColor':'#fb6c6c'},300).animate({ opacity: 0.35 }, "slow");
   }, 
   success: function()
   {

    //parent.slideUp('slow', function() {$(this).remove();});

  }

 });

return false;
    });
});

});

1 个答案:

答案 0 :(得分:1)

我想清除id属性的第一件事在整个HTML元素中应该是唯一的,而不是你可以在多个元素中使用类,或者你可以在循环中使用唯一的ID,如下面$chann['id']-channelName我假设数据库中的id是独特

<ol class="update">
<?php
$ss = mysql_query ("SELECT * FROM users_channels WHERE u_id='$uid'");
while($chann = mysql_fetch_assoc($ss)) {
echo'              
<li>
<input name="channelName" type="text" id="'.$chann['id'].'-channelName" style="float:left; width:300px; border:1px solid #CCC;" value="'.$chann['channel_name'].'" />
<a href="#" id="'.$chann['id'].'-delete" class="delete_button"><span id="rcolor">Delete</span></a>
<a href="#" id="'.$chann['id'].'" title="'.$chann['channel_name'].'" class="save_button"><span id="gcolor">Save</span></a>
</li>';
}
?>
</ol>

在准备好的功能中,您可以获得如下输入值

$(".save_button").click(function() {
var id = $(this).attr("id");
var cvalue = $("#"+id+"-channelName").val();// you can grab the sibling input value

OR

var cvalue = $(this).attr('title');// you can grab the value from title attribute

var dataStringe = 'id='+ id + '&cvalue='+ cvalue;
var parent = $(this).parent();

// var delete =  $("#"+id+"-delete") to get delete anchor 
});

使用ready之后,无需使用$(function() {,两者都是平等的

PHP注意事项

  

Please, don't use mysql_* functions in new code。它们不再被维护and are officially deprecated。请参阅red box?转而了解prepared statements,并使用PDOMySQLi - this article将帮助您确定哪个。如果您选择PDO here is a good tutorial