查找动态创建的自动完成的表单输入的名称

时间:2014-01-17 23:15:32

标签: jquery jquery-ui jquery-ui-autocomplete

我有一个动态创建自动填充表单字段的表单。我想要做的是获取自动填充字段的名称,并将其发送到数据请求中的coldfusion cfc。这是我尝试没有运气的代码。

$("[id^=applinput_]").each(function(){
            app_id = this.id.split("_");
            id = app_id[1];

            $("#applinput_"+ id).autocomplete({
                source: function(request, response) {
                    $.ajax({
                        url: "cfc/cfc_Appliance.cfc?method=getAppliance&returnformat=json",
                        dataType: "json",
                        data: {
                            nameApplianceSearchString: request.term,
                            nameApplianceTypeString: $(this).attr("name"), 
                            maxRows: 25,
                            style: "full",
                        },

                        success: function(data) {
                            response(data);
                        }
                    })
                },
                select: function(event, ui) {
                        //separate id and checkbox
                        app_selid = this.id.split("_");
                        //separate id 
                        applid = app_selid[1];  
                $(this).val(ui.item.label);
                $('#typeinput_' + applid).val(ui.item.type);
                $('#hidden_typeinput_' + applid).val(ui.item.typeID);
                return false;
                },
            })
        })
        .data( "autocomplete" )._renderItem = function( ul, item ) 
            {
                return $( "<li></li>" )
                .data( "item.autocomplete", item )
                .append('<a onmouseover=$("#span' + item.value + '").show(); onmouseout=$("#span' + item.value + '").hide();><span style="float:left;" >' + item.label + '</span><span  id="span' + item.value + '" style="float: right;height:inherit; font-size: 13px; font-weight: bold; padding-top: 0.3em; padding-right: 0.4em; padding-bottom: 0.3em; padding-left: 0.4em; display: none; cursor:pointer; " onclick=javascript:event.stopPropagation();showprofile("' + item.value + '");><!---view profile---></span><div style="clear:both; height:auto;"></div></a>')
                .appendTo( ul );
            };      
        } catch(exception){}
        });

当请求触发到cfc时,它会在没有nameApplianceTypeString的情况下触发。

1 个答案:

答案 0 :(得分:1)

替换此块:

data: {
       nameApplianceSearchString: request.term,
       nameApplianceTypeString: $(this).attr("name"), 
       maxRows: 25,
       style: "full",
        },

用这个:

data: {
       nameApplianceSearchString: request.term,
       nameApplianceTypeString: $(this.element).attr("name"), 
       maxRows: 25,
       style: "full"
       },

这是一个小提琴:http://jsfiddle.net/jeBUV/

请注意,我必须稍微修改它以获得在jsfiddle中工作的ajax调用。有关在小提琴中制作ajax请求的说明,请参阅jsfiddle文档:http://doc.jsfiddle.net/use/echo.html