0

I created a table using with Account lookup field along with other fields. I have assigned same style class name to all lookup as they're mandatory. VF code:

 <apex:page>
   <apex:pageblock>
    <apex:pageblocktable value="{!conList}" var="c">
    <apex:column><apex:outputText value="{!c.Name}" /></apex:column>
    <apex:column><apex:inputField value="{!c.AccountId}" style="reqCheck"/></apex:column>
    </apex:pageblocktable>
   <apex:commandButton value="save" onclick="if(!Validation()){return false;}" />
   <apex:pageblock>
    </apex:page>

User will get a list of contacts who can change the Account but can't put null value in account before saving. On save buttons have executed a jquery validation as follows:

<script>
    function Validation(){
        var index;
        $('.reqCheck').each(function(){
            index = 0;
             var r1=$.trim($(this).val());
             if(!r1){
                 index = 1;
                 alert('Account is empty.Please fill it');
                 $(this).focus();
                 return false;
             }

        });
        if(index == 0) return true;
             else return false;
    }
</script>

Problem: Here,in html(inspect element) style class 'reqCheck' is assigning for lookup icon too. And my javascript code is checking the lookup icon value which will be null and throwing the error even if the accountId is filled.

enter image description here Is there any work around for it?

| improve this question | | | | |
3

I recommend you just set required="true" on your <apex:inputField> tags:

<apex:inputField value="..." class="..." required="true" />

If you do the above you can strip out all your javascript tags.

If you insist on rolling your own Javascript here, note that you can just change your selector to 'input.reqCheck':

$('input.myClass').forEach(...)

That said, you shouldn't use jQuery unless you have to, and definitely don't reference it using a $ outside of a closure. You should only define your functions within such a closure anyway.

(function () {
    // add a class to your save button
    document.querySelector('.saveButton').addEventHandler("click", function () {
        [].forEach.call(
            document.getElementsByClassName("myRequiredClass"), 
            function (element) {
                console.log(element.value);
                // or do a real operation
            }
        );
    });
}());
| improve this answer | | | | |
  • reuired='true' doesn't work my situation because I'm rerendering the block and in this case, it will stops my execution saying, 'Field is required'. Thank you for javascript code. I will take help of it. – Rv1 Mar 5 '18 at 16:14
0

I got a better work around(I hope so). In my case, lookup position value is even number. So, i planned to skip the even numbers(which are look up icon values) of the list while comparing as follows:

function Validation(){
    var index;
    **var int1 = 0;**
    $('.reqCheck').each(function(){
        index = 0;
         var r1=$.trim($(this).val());
         if(!r1 && **int1%2 == 0**){
             index = 1;
             alert('Account is empty.Please fill it');
             $(this).focus();
             **int1 = parseInt(int1)+1;**
             return false;
         }
             **int1 = parseInt(int1)+1;**

    });
    if(index == 0) return true;
         else return false;
}

Above trick worked for me. Please let me know, if there is any issue with my code.

Thank You.

| 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.