2011-09-29 59 views
1

我有一种复杂的php,html脚本,用于创建交互式设计。我使用重复表,我基本上克隆特定表行的内容并将其附加到表的末尾。当我在选择菜单中选择某个选项时,相应的文本框将更新为正确的值。然而,克隆行行为不正确jquery动态更改文本框值更改表格行克隆后

我问的是如果有一种方法,使这个领域也改变了价值观。以下是用于添加/克隆行的各种代码 。请注意,ID信息是一个表行

$("#addrow1").click(function(){ 
     //alert("It works"); 

     //$('#description tr:last').after('<tr>...</tr>'); 
     $('#details').clone().appendTo('#dailyexpense');  


      }); 

代码改变文本框的id和文本值

$("#cities").live('change',function(){ 
var cityrates = $("#cities :selected").val(); 
var brkfstrates = (0.2 * cityrates).toFixed(1); 
$("#brkfasttxt").val(brkfstrates); 
$("#brkfastchk").val(brkfstrates); 
var lunchrates = (0.3 * cityrates).toFixed(1); 
$("#lunchtxt").val(lunchrates); 
$("#lunchchk").val(lunchrates); 
var dinnerrates = (0.3 * cityrates).toFixed(1); 
$("#dinnertxt").val(dinnerrates); 
$("#dinnerchk").val(dinnerrates); 
var incdntlrates = (0.2 * cityrates).toFixed(1); 
$("#incidentltxt").val(incdntlrates); 
$("#incidentlchk").val(incdntlrates); 
}); 

我的表行代码,这个被浏览器加载一个

<tr id="details"> 
     <td><label for="date"></label> 
     <input style="background-color:#CCC;" type="text" name="date" id="date" /></td> 
     <td><label for="cities"></label> 
     <select name="cities" id="cities" style="background-color:#CCC; width:220px;"> 
     <?php   
foreach($country as $makassi1){ 
$selectcities = "SELECT City, Country, Rate FROM perdiem_rates WHERE Country = '$makassi1'"; 
$checkcity = mysql_query($selectcities)or die(mysql_error()); 
$countcities = mysql_num_rows($checkcity); 

while($row=mysql_fetch_assoc($checkcity)) 
{ 

    $countries = ($row['Country']); 
    $names =($row['City']) ; 
    $rate =($row['Rate']) ; 
    $ratess=$countries."-".$names 
    ?> 

<option id="cityoptrates" value="<?php echo $rate; ?>"> 
<?php echo $ratess; ?> 
</option> 
<?php  
} 
}   
     ?> 
     </select></td> 
     <td><input name="brkfastchk" type="checkbox" class="chkbox" id="brkfastchk" /> 
     <label for="brkfasttxt"></label> 
     <input style="background-color:#CCC;" name="brkfasttxt" type="text" id="brkfasttxt" size="5" readonly="readonly" /> 
     <label for="brkfastchk"></label></td> 
     <td><input type="checkbox" name="lunchchk" id="lunchchk" class="chkbox" /> 
     <label for="lunchtxt"></label> 
     <input style="background-color:#CCC;" name="lunchtxt" type="text" id="lunchtxt" size="5" readonly="readonly" /> 
     <label for="lunchchk"></label></td> 
     <td><input type="checkbox" name="dinnerchk" id="dinnerchk" class="chkbox" /> 
     <label for="dinnertxt"></label> 
     <input style="background-color:#CCC;" name="dinnertxt" type="text" id="dinnertxt" size="5" readonly="readonly" /> 
     <label for="dinnerchk"></label></td> 
     <td><input type="checkbox" name="incidentlchk" id="incidentlchk" class="chkbox" /> 
     <label for="incidentltxt"></label> 
     <input style="background-color:#CCC;" name="incidentltxt" type="text" id="incidentltxt" size="5" readonly="readonly" /> 
     <label for="incdntchk"></label></td> 
     <td colspan="2"><label for="daily_totals"></label> 
     <input style="background-color:#CCC;" name="daily_totals" type="text" id="daily_totals" size="5" /></td> 
    </tr> 

根据上述我的textfield值更改代码完美地工作与第一个初始行。克隆的行不起作用。唯一一个在克隆行上工作的是用于选择城市的选择菜单。需要帮助。接受建议和改进。

链接到实际的代码中的jsfiddle http://jsfiddle.net/NAafu/10/

+0

仅供其他人使用 - 我认为Max's的其他问题的解决方案也将解决此问题。 http://stackoverflow.com/questions/7620736/jquerysum-values-of-checkbox-on-same-row-to-textfield-on-same-row – mrtsherman

回答

1

在你的情况,也许你也应该克隆事件:

$('#details').clone(true).appendTo('#dailyexpense'); 

clone()

编辑的文档中所述 - 这个问题也许是您正在使用仅返回一个元素的ID选择器($("#cities").live)。 Ids在页面上应该是唯一的,您应该使用类别

+0

试过,但它没有奏效。有关ID和类的内容应该是动态生成的或唯一的。不管怎么说,还是要谢谢你。我不明白的是为什么克隆的#cities有效。 – MaxI

+0

如果你在jsFiddle上发布一个例子,也许我们可以帮助你更好 –

+0

我有php代码与数据库交互。这会工作还是我张贴虚拟代码?我对jsfiddle完全陌生 – MaxI