这是场景:@H_404_3@
我有一个位置树,我的用户需要通过它来获取特定值.我有一个SELECT通过ajax加载顶级位置.数据具有更精细的值以缩小选择范围,因此我根据用户选择的内容添加新的SELECT.当用户到达数据的可用选项的末尾时,我停止添加SELECT并获取最后一个的值,这就是我所追求的.@H_404_3@
我对此进行编码的方式是从一个具有硬连接的顶级位置ID的SELECT开始,然后有一个’onchange’事件处理程序,它将进入我的数据库并抓取子选项,然后创建新的在当前的TD内选择.@H_404_3@
这种情况一直持续到最后选择没有孩子归还.那时,我可以获得这个最终位置的ID.@H_404_3@
这很有效,直到用户决定改变一两个选择“上游”的东西.@H_404_3@
下面是一个已经找到位置树的用户可能拥有的内容(这些是代码中的SELECT):@H_404_3@
美国 – >俄亥俄州 – > Cuyahoga – >克利夫兰 – > 1区@H_404_3@
如果’第1区’是这个位置链中的最后一个可用项目,我可以使用$(‘#locations select:last’).val()获得它. Wunderbar酒吧.@H_404_3@
什么不能很好地工作是如果用户决定,“嗯,不,它不是Cuyahoga我追求,但Stow”,并改变第三选择选项.我需要做的是删除具有’Cuyahoga’的选择之后的所有选择,因为我现在必须为“Stow”获取任何进一步的数据.先前选择后的任何选择都不再有效.@H_404_3@
正在操作的选择在onchange事件中传递给自己,因此我有当前元素.我尝试过$(elem).after().remove(),但这不起作用.@H_404_3@
关于如何在当前的SELECT之后删除所有SELECT的任何想法?@H_404_3@
谢谢!@H_404_3@
doc的结构看起来像这样:@H_404_3@
<table border id="loctable"> <tr><th>Location:</th><td><select id="loc0" onchange="return UpdateLocationSelect(this);"> <option>choose..</option> <option value="3">USA</option> </select> </td> </tr>@H_403_29@[剪断]@H_404_3@
function UpdateLocationSelect(elem) { // load sub locations for PPID given. IN this case,locations under USA. add options to elem // Also,erase any selects after this one,in case the user has "backed up" his selection $(elem).next().remove(); // Help needed here!! how to remove any SELECTs after this one?? $.ajax({ url: "api.PHP",dataType: "json",data: { cmd: "sublocs","pid": elem.value },async: false,success: function( data,textStatus ) { // results if( $(data).length ) { $('#loctable td').append( "<select onchange='return UpdateLocationSelect(this);'><option>choose..</option></select>"); $.each( data,function( key,val ){ $('#loctable select:last').append( '<option value="'+key+'">'+val+'</option>' ); }); } else { // we've hit the end of this location branch. Alert to check val is right alert( "LocID: " + $('#loctable select:last').val() ); } },}); return false; }@H_403_29@