6

I stucked in visualforce tag, Actually I have three input elements which are below

1) First is Picklist type 2) Second is inputtext type 3) Third is also inputtext type.

These three elements are displaying in the same order.

When user visit my page he/she see that the inputtext element which is coming after the picklist element has got the focus instead of picklist element. So I want that focus should come on picklist element.

My code is

<apex:page controller="StackExchangeClass">
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script> 
<script>
  $( document ).ready( function(){
   var o = $("#name");
   o.focus();
   var idd= o.attr('id');
   alert(idd);
   document.getElementById(idd).focus();
    alert(idd);});
</script>
<apex:form >
    <apex:pageBlock >
        <apex:pageBlockSection >
           <apex:selectList styleClass="cla" value="{!text1}" size="1">
                <apex:selectOptions value="{!lst}"></apex:selectOptions>
            </apex:selectList>
            <apex:inputText  styleClass="class" value="{!text}" />
           <apex:inputText  styleClass="class1" value="{!text2}" />
            <input type="text" id="name" value="te" />
        </apex:pageBlockSection>
    </apex:pageBlock>
</apex:form>
</apex:page>
7

I would try to use the window.onload and then with jQuery just blur all inputs anf then set focus the picklist:

<script>
    window.onload = function(){
        jQuery('input[type=text]').blur();
        jQuery('[id$=pList]').focus();
    };
</script>

<apex:pageBlock>
    <apex:pageBlockSection>
        <apex:selectList size="1" id="pList">
            <apex:selectOptions value="{!Items}"/>
        </apex:selectList> 
        <apex:inputText value="{!output1}"/>
    </apex:pageBlockSection>    
</apex:pageBlock>
|improve this answer|||||
1

The problem in your code is that jQuery $ conflicts with other libraries thats is the reason your code didn't work so you need to remove conflict using jQuery.noConflict() before using jQuery:

<script>
  $j = jQuery.noConflict(); 
  $j( document ).ready( function(){
   //use $j for jQuery
</script>

or use anonymous function passing jQuery as argument and recieve it as $ parameter and you can use it with $ character:

(function( $ ) { //receive as $ alias
  //use $ from here 
})(jQuery);
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.