2016-03-28 89 views
-1
<apex:page standardController="account" id="page"> 
    <apex:includeScript value="//cdn.jsdelivr.net/jquery/1.7/jquery.min.js" /> 
    <apex:includeScript value="//cdn.jsdelivr.net/jquery.colresizable/1.3/colResizable.min.js" /> 
    <apex:includeScript value="{!URLFOR($Resource.JqueryA, 'js/jquery-ui-1.8.16.custom.min.js')}" /> 
    <!-- <apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"/> 
      <apex:includeScript value="{!URLFOR($Resource.select2, 'select2/select2.js')}"/>--> 

    <apex:form id="form1"> 
     <br /> 
     <apex:outputpanel id="counter1"> 
      <apex:pageBlock id="block1"> 
       <apex:pageBlockSection id="section1"> 

        <c:AutoCompleteV2 allowClear="true" id="d" importJquery="true" labelField="name" SObject="account" valuefield="name" targetField="{!account.name}" /> 
       </apex:pageBlockSection> 
      </apex:pageBlock> 
      <apex:commandButton reRender="none" value="Get value" /> 
      <b><a href="#" onClick="clearValue()"><apex:commandButton value="Reset" onclick="this.form1.reset();return true;" rerender="counter1"/></a> </b> 
     </apex:outputpanel> 
    </apex:form> 
    <script type="text/javascript"> 
     function clearValue() { 
      //alert($("input[id$='d']").val()); 
      $("input[id$='d']").val(''); 
     } 
    </script> 
</apex:page> 

Visualforce组件清除值:无法使用jQuery

<apex:component controller="AutoCompleteV2_Con" selfClosing="true"> 
    <apex:attribute name="SObject" description="SOQL Object to query" type="String" assignTo="{!sObjVal}" required="true" /> 
    <apex:attribute name="labelField" description="API Name of Field to display for label" type="String" required="true" assignTo="{!labelFieldVar}" /> 
    <apex:attribute name="valueField" description="API Name of Field to display for value that is passed to the targetField" type="String" required="true" assignTo="{!valueFieldVar}" /> 
    <apex:attribute name="targetField" description="Field of current object that will hold the selection." type="Object" assignTo="{!targetFieldVar}" /> 
    <apex:attribute name="inputFieldId" description="Id of the field where the value will copied[Not generally required, used when you need to copy value to a field using js]" type="String" /> 
    <apex:attribute name="importJquery" description="Assign false if you dont want to jquery files" type="Boolean" default="true" /> 
    <apex:attribute name="syncManualEntry" description="Allow manual entry of data from autocomplete component." type="Boolean" default="true" /> 
    <apex:attribute name="allowClear" description="Set true to give user a option to clear existing value" type="Boolean" default="true" /> 

    <apex:attribute name="Style" description="style for the input component" type="String" /> 
    <!--Required js files--> 
    <apex:outputPanel rendered="{!importJquery}"> 
     <apex:includeScript value="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" /> 
    </apex:outputPanel> 
    <apex:includeScript value="{!URLFOR($Resource.select2, 'select2/select2.js')}" /> 
    <apex:stylesheet value="{!URLFOR($Resource.select2, 'select2/select2.css')}" /> 
    <script> 
     var v2 { 
      !randomJsIden 
     } 

     var prevVal { 
      !randomJsIden 
     }; 

     function autocompleteV2 { 
      !randomJsIden 
     }() { 
      var v2 = this; 
      jQuery(function($) { //on document.ready 
       v2.init($) 
      }); 
     } 

     autocompleteV2 { 
      !randomJsIden 
     }.prototype = { 
      init: function($) { 

       var $elem = $(".auto{!randomJsIden}").select2({ 
        minimumInputLength: 1, 
        placeholder: "No value selected", 
        allowClear: {!allowClear 
        }, 
        query: function(query) { 
         queryData { 
          !randomJsIden 
         }(query); 

        }, 
        createSearchChoice: function(term, data) { 
         if ({!syncManualEntry 
          } == true) { 
          return { 
           id: term, 
           text: term 
          }; 
         } 
        } 
       }); 

       $elem.on("select2-selecting", function(e) { 

        $('.hiddenField{!randomJsIden}').val(e.val); 
       }); 

       $elem.on("select2-removed", function(e) { 
        $('.hiddenField{!randomJsIden}').val(''); 
       }); 



       if ('{!cacheField}' != '') { 
        $elem.select2("data", { 
         id: "{!targetFieldVar}", 
         text: "{!cacheField}" 
        }) 
       } 

      }, 

      triggerSearch: function(val) { 

       if (prevVal { 
         !randomJsIden 
        } != val) { 
        $ = jQuery; 
        prevVal { 
         !randomJsIden 
        } = val; 
        var select = $('input.auto{!randomJsIden}'); 
        var search = $('.select2-input') 
        select.select2('open'); 
        search.val(val); 

        search.trigger("input"); 
       } 
      } 
     } 

     /* 
     *This method queries data according to the passed parameter 
     *and populates the combobox accordingly 
     ***/ 
     function queryData { 
      !randomJsIden 
     }(query) { 

      Visualforce.remoting.Manager.invokeAction(
       '{!$RemoteAction.AutoCompleteV2_Con.getData}', '{!sObjVal}', '{!labelFieldVar}', '{!valueFieldVar}', query.term, 
       function(result, event) { 

        //if success 
        if (event.status) { 
         var data = { 
          results: [] 
         } 
         data.results = result; 
         query.callback(data); 
        } else { 
         alert('Invalid Field/Object API Name : ' + event.message); 
        } 

       }, { 
        escape: true 
       } 
      ); 
     } 
    </script> 

    <apex:inputText style="{!Style}" styleClass="auto{!randomJsIden}" value="{!cacheField}" /> 

    <apex:outputPanel id="hiddenPanel"> 
     <apex:inputText value="{!targetField}" id="hiddenField" styleClass="hiddenField{!randomJsIden}" style="display:none" /> 
    </apex:outputPanel> 
    <script> 
     v2 { 
      !randomJsIden 
     } = new autocompleteV2 { 
      !randomJsIden 
     }({}); 
    </script> 
</apex:component> 

脚本:

<script type="text/javascript"> 
    function clearValue() { 
     //alert($("input[id$='d']").val()); 
     $("input[id$='d']").val(''); 
    } 
</script> 

我能够获得价值,但是,我不能能够清晰的价值。

我在后面的visualforce组件级别使用select2组件。

我在我的visualforce页面上使用visualforce组件显示自动填充.cant能够使用按钮重置值。

+0

我很想看到更多格式化的代码。 –

+0

这不是你应该如何声明变量'var v2 {randomJsIden }'该Javascript代码中有近50个语法错误。 –

回答

0

我用这个和它的作品

$("input[id=d]").val(""); 

让我知道它是否适合你。

+0

不工作我试过了 – tejdeep