使用 jquery 获取 Id 以进行 jeditable
我一直在制作一个网站,现在正在研究它的管理部分,以便可以轻松管理用户,轻松修改文章等。 我想使用 jeditable,这样管理就非常容易使用。
JEditable 的一部分正在工作(p 标签正在成为输入),但是我在通过 ajax 请求发送产品的 id 时遇到问题。
这是我当前拥有的 html 代码(由 php 生成):
<table class="admin_list">
<tr>
<th style="width: 110px;">First Name</th>
<th style="width: 110px;">Last Name</th>
<th style="width: 100px;">Date of Birth</th>
<th style="width: 200px;">Email</th>
<th style="width: 140px;">Address</th>
<th style="width: 112px;">Postal Code</th>
<th style="width: 112px;">Town</th>
<th style="width: 120px;">Country</th>
<th style="width: 115px;">Login</th>
<th style="width: 42px;">Action</th>
</tr>
<tr class="2">
<td><p class="editable">Another</p></td>
<td><p class="editable">User</p></td>
<td><p class="editable">11/11/1911</p></td>
<td><p class="editable">[email protected]</p></td>
<td><p class="editable">Address</p></td>
<td><p class="editable">56130</p></td>
<td><p class="editable">Town</p></td>
<td><p class="editable">2</p></td>
<td><p class="editable">bob</p></td>
<td>
<a href="http://localhost/monline/private_html/musiconline/?delete/user/2">D</a>
<a href="">U</a>
<a href="">D</a>
</td>
</tr>
<tr class="1">
<td><p class="editable">Daniel</p></td>
<td><p class="editable">Lucas</p></td>
<td><p class="editable">10/04/1990</p></td>
<td><p class="editable">[email protected]</p></td>
<td><p class="editable">myAddress</p></td>
<td><p class="editable">12345</p></td>
<td><p class="editable">myTown</p></td>
<td><p class="editable">8</p></td>
<td><p class="editable">dan</p></td>
<td>
<a href="http://localhost/monline/private_html/musiconline/?delete/user/1">D</a>
<a href="">U</a>
<a href="">D</a>
</td>
</tr>
</table>
<input type="text" class="edit_id" value="" />
这是我编写的 jquery:
$( function() {
$('.admin_list tr').hover( function() {
$('.edit_id').attr( 'value', $(this).attr('class') );
});
$('.editable').editable("http://localhost/monline/private_html/musiconline/?admin/edit/users/" + $('.edit_id').attr('value'), {
indicator : 'Saving...',
onblur : 'submit',
method : 'PUT'
});
});
正如你所看到的,当鼠标悬停在上方时,我正在获取当前行的 ID(我想避免),但是当我提交页面时,ID 未在 jeditable url 中设置。
有谁知道如何对其进行排序,因为我想在管理面板中使用就地编辑器?
作为可选请求,我如何获得围绕已单击的输入的 tr 的类?我已经尝试过类似 $(this).parent().parent().attr('class')
谢谢 担
I've been making a site and am now working on the administration part of it so that users can easily be managed, articles easily modified etc.
I wanted to use jeditable so that the admin would be really easy to use.
Part of JEditable is working (the p tags are becoming inputs) however I'm having trouble sending the id of the product through the ajax request.
Here's the html code I currently have (generated by php):
<table class="admin_list">
<tr>
<th style="width: 110px;">First Name</th>
<th style="width: 110px;">Last Name</th>
<th style="width: 100px;">Date of Birth</th>
<th style="width: 200px;">Email</th>
<th style="width: 140px;">Address</th>
<th style="width: 112px;">Postal Code</th>
<th style="width: 112px;">Town</th>
<th style="width: 120px;">Country</th>
<th style="width: 115px;">Login</th>
<th style="width: 42px;">Action</th>
</tr>
<tr class="2">
<td><p class="editable">Another</p></td>
<td><p class="editable">User</p></td>
<td><p class="editable">11/11/1911</p></td>
<td><p class="editable">[email protected]</p></td>
<td><p class="editable">Address</p></td>
<td><p class="editable">56130</p></td>
<td><p class="editable">Town</p></td>
<td><p class="editable">2</p></td>
<td><p class="editable">bob</p></td>
<td>
<a href="http://localhost/monline/private_html/musiconline/?delete/user/2">D</a>
<a href="">U</a>
<a href="">D</a>
</td>
</tr>
<tr class="1">
<td><p class="editable">Daniel</p></td>
<td><p class="editable">Lucas</p></td>
<td><p class="editable">10/04/1990</p></td>
<td><p class="editable">[email protected]</p></td>
<td><p class="editable">myAddress</p></td>
<td><p class="editable">12345</p></td>
<td><p class="editable">myTown</p></td>
<td><p class="editable">8</p></td>
<td><p class="editable">dan</p></td>
<td>
<a href="http://localhost/monline/private_html/musiconline/?delete/user/1">D</a>
<a href="">U</a>
<a href="">D</a>
</td>
</tr>
</table>
<input type="text" class="edit_id" value="" />
Here's the jquery I've written:
$( function() {
$('.admin_list tr').hover( function() {
$('.edit_id').attr( 'value', $(this).attr('class') );
});
$('.editable').editable("http://localhost/monline/private_html/musiconline/?admin/edit/users/" + $('.edit_id').attr('value'), {
indicator : 'Saving...',
onblur : 'submit',
method : 'PUT'
});
});
As you can see I'm getting the ID of the current row when the mouse hovers over (which I would like to avoid), however when I submit the page the ID is not being set in the jeditable url.
Does anyone know how this can be sorted as I would like to use an in-place editor for the admin panel?
As an optional request how could I get the class of the tr surrounding the input that's been clicked on? I've tried something along the line of $(this).parent().parent().attr('class')
Thanks
Dan
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您是否尝试过(没有悬停功能,
$(this).closest('tr').attr('value')
应该指向相对的)
Have you tried (without the hover function,
$(this).closest('tr').attr('value')
should point to the relative<tr>
)