我正在尝试向包含2个单元格的表添加一行。 单元格1:输入字段中的文本 单元格2:评价星形鼠标 这是我的HTML:
<div>
<button type="button" id="cl" onclick="checkit()">Check I'm working</button>
</div>
<p><b> Please enter an item, rate it, and click <i>Add to Remedy</i>thanks</b></p>
<div class="form-group">
<div>
<label id="inp-title" class="control-label" for="formInput1">Field label</label>
<input type="text" class="form-control" id="formInput1" placeholder="Placeholder text">
</input>
</div>
<div>
<div id="rateit_id" class="rrateit"></div>
</div><br><br>
<button type="button" id="add-to-remedy" class="btn btn-default">Add to Remedy</button>
<div>
<table class="table" id="remedy-tbl">
<thead>
<tr>
<th>Remedy Item</th>
<th>Item Rating</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
</div>
这是我的JQuery:
$( document ).ready(function() {
var rate-val= 0;
$('div#rateit_id').rateit();
function checkit(){
alert("HELLO WORLD!");
};
$("#rateit_id").click(function() {
rate-val = ($(this).rateit('value'));
});
$("#add-to-remedy").click(function()
{
var htmlToAppend =
'<tr><td>' + $('input[type=text].form-control').val() + '</td><td>' +
'<div class="rateit" data-rateit-value="' + rate-val +
'" data-rateit-ispreset="true" data-rateit-readonly="true"></div>' + '</td></tr>';
$("#remedy-tbl").append ( htmlToAppend );
newTableRow.appendTo("#remedy-tbl");
});
});
这里是没有工作的jsFiddle http://jsfiddle.net/gZ9by/8/我明白问题是javascript无效,但我不知道为什么。对此的帮助也将非常感激。 谢谢 大卫
答案 0 :(得分:0)
我认为你的rateit函数有一个错误,这就是为什么前面的jquery没有工作,否则你的代码就好了。
答案 1 :(得分:0)
好的 - 首先我更改了&#39; rate-val&#39;不使用减法符号(JavaScript变量无效)。我还修复了一些JavaScript错误。
在将项目添加到表格的部分中,您实际上并未将rateval变量放入div中。您将其置于自定义数据绑定中,但不是实际显示HTML的位置。
我更新如下:
$("#add-to-remedy").click(function () {
var htmlToAppend =
'<tr><td>' + $('input[type=text].form-control').val() + '</td><td>' +
'<div class="rateit" data-rateit-value="' + rateval +
'" data-rateit-ispreset="true" data-rateit-readonly="true">' + rateval + '</div>' + '</td></tr>';
$("#remedy-tbl").append(htmlToAppend);
newTableRow.appendTo("#remedy-tbl");
});
从我的角度来看未知(由于不知道价格框架)是数据利率值应该做的事情。如果在分配data-rateit-value时应该自动填充div,那么我不知道应该用它修复什么。也就是说,我相信以下小提琴能够实现你想要的目标。