Forum Stats

  • 3,852,479 Users
  • 2,264,108 Discussions
  • 7,905,079 Comments

Discussions

How to stop JSF to append extra text in ID attribute of th components

User_LWFOQ
User_LWFOQ Member Posts: 78 Blue Ribbon
edited Nov 13, 2019 3:19AM in WebCenter Portal

Hi,

How to stop JSF to append extra text in ID attribute of th components.

But if I change my JSF inputfield to <input type="text" id="test_userID" values="test"/>

In first case(with the JSF inputfield) , when I saw the 'Source Code' of my page, I noticed that instead of the 'test_userID' in ID attribute of my JSF inputfield it has some extra appended text too

i.e <input id="j_id_jsp_743478906_1:test_userID" type="text" name="j_id_jsp_743478906_1:test_userID" value="jaik" />

Thanks,

Jaysing

Answers

  • Daniel Merchán
    Daniel Merchán Enterprise Achitect Member Posts: 2,192 Gold Trophy
    edited Oct 10, 2019 4:18AM

    Hi,

    JSF and ADF generate the IDs based on the named containers wrapping your components.

    You cannot stop JSF generating the IDs

    If you need to access to your components by ID easily or remember their IDs you have many choices:

    • If you are trying using JavaScript Make the component accessible by using clientComponent="true" to expose it.
    • Another trick is the usage of a backing bean with a binding to the component.
      You can expose a method to return the clientId generated of the component (yourUIComponent.getClientId())
      By doing this you can easily send via af:clientAttribute to a JavaScript function the exact clientId of a component if you are trying to access a component which is not the event generator.

    If you face any issue with those IDs let me know and I can help.

    Kind regards.

  • User_LWFOQ
    User_LWFOQ Member Posts: 78 Blue Ribbon
    edited Oct 24, 2019 10:41AM

    Hi Daniel,

    Thank you Daniel..

    We are facing such issue regularly  after deployment .

    Really we need  your help .

    Our complete code is in Webcenter Portlet  only java script is in Portal and portlet is consumed by  Portal .

    in jsp file there is id for form and table and component .

    backOrder.jsp  file is in Portlet as follows:

    <%@ page contentType="text/html;charset=UTF-8" autoFlush="true"%>

    <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>

    <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>

    <f:view>

        <html>

            <head>

                <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

                <f:loadBundle basename="com.apoteket.model.backOrder.resource.BackOrderBundle" var="msg"/>

           

          

            <script src="js/backOrderItem.js" type="text/javascript"></script>

            <LINK href="css/backOrderItem.css" rel="stylesheet" type="text/css">

          

            </head>

           

            <body>

               

                <h:panelGrid id="withstores">

               

                    <%-- Store Selection--%>

                    <h:panelGroup layout="block">

                        <h:form id="storeSelectForm">

                            <h:outputText value="#{msg.selectPharmacy}"

                                          rendered="#{BackOrderPortletBean.multipleStores}"

                                          styleClass="selectPharmacy"/>

                            <h:panelGroup layout="block">

                                <h:selectOneMenu id="storeSelect"

                                                 value="#{BackOrderPortletBean.selectedStore}"

                                                 onchange="submit();return confirmSubmit(\'#{msg.unsavedDataWarning}\');"

                                                 valueChangeListener="#{BackOrderPortletBean.findBackOrderedItems}"

                                                 styleClass="dropdownMenu"

                                                 rendered="#{BackOrderPortletBean.multipleStores}">

                                    <f:selectItems value="#{BackOrderPortletBean.stores}"

                                                   id="selectItems1"/>

                                </h:selectOneMenu>

                                <h:outputText value="#{BackOrderPortletBean.store}"

                                          rendered="#{not BackOrderPortletBean.multipleStores}"

                                          styleClass="selectPharmacy"/>

                            </h:panelGroup>

                           

                           

                              <h:outputText value="#{msg.selectSupplier}"

                                          styleClass="selectPharmacy"/>

                                <h:panelGroup layout="block">

                                     <h:selectOneMenu id="supplierSelect"

                                                 value="#{BackOrderPortletBean.selectedSupplier}"

                                                 onchange="submit();return confirmSubmit(\'#{msg.unsavedDataWarning}\');"

                                                 valueChangeListener="#{BackOrderPortletBean.backOrderitemFilterAction}"

                                                 styleClass="dropdownMenu"

                                                 >

                                    <f:selectItems value="#{BackOrderPortletBean.supplierList}"

                                                   id="selectItems11"/>

                                </h:selectOneMenu>

                               

                            </h:panelGroup>

                           

                        </h:form>

                    </h:panelGroup>

                   

                    <h:panelGroup layout="block">

                    <h:panelGrid styleClass="backOrderItemBody">

                            <h:form id="backOrderItemform">

                                <h:panelGrid columns="3"

                                             columnClasses="alignLeft,alignCenter">

                                    <%-- BackOrderItem Title--%>

                                    <h:panelGroup layout="block">

                                        <h:outputLabel value="#{msg.backOrderItem}"

                                                       styleClass="backOrderItemTitle"/>

                                    </h:panelGroup>

                                    <h:panelGroup layout="block">

                                        <h:outputLabel value="#{msg.nobackOrderItemMsg}"

                                                       rendered="#{BackOrderPortletBean.nobackOrderItemMsg}"

                                                       styleClass="warning"  />

                                                      

                                    </h:panelGroup>

                                   

                                   

                                    <h:panelGroup layout="block">

                                    <h:commandButton value="#{msg.search}" styleClass="alignRight"

                                                             action="#{BackOrderPortletBean.getBackorderTableDetails}"

                                                             disabled="#{BackOrderPortletBean.search}"

                                                             onclick=" "/>

                                    </h:panelGroup>

                          

                                </h:panelGrid>

                               

                               

                                <h:panelGrid columns="1" columnClasses="alignCenter">

                                  <h:panelGroup layout="block">

                                        <h:outputLabel value="#{BackOrderPortletBean.errorMsgFromDb}"

                                                       rendered="#{BackOrderPortletBean.nobackOrderSqlErrMsg}"

                                                       styleClass="warning"  />

                                                      

                                  </h:panelGroup>

                                </h:panelGrid>

                               

                                <!--data table-->

                                <h:panelGroup layout="block" styleClass="backOrderItemDataTable">

                                    <h:dataTable id="backOrderItemList" var="backOrderItem"

                                                 value="#{BackOrderPortletBean.backOrderList}"

                                                 columnClasses="alignLeftbackOrderItemDataTable"

                                                 width="97%" cellpadding="3"

                                                 cellspacing="0"

                                                 headerClass="backOrderItemDataTableHeader">

                                                

                                                

                                          <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.remove}"  style ="width:40px;"

                                                                       id="accept"/>

                                                    </h:panelGroup>

                                                   

                                                       <h:panelGroup layout="block">

                                                        <h:inputText id="remove12"

                                                                     maxlength="10"

                                                                     size="10"

                                                                     value=""

                                                                     styleClass="hidden"/>

                                                       </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                           

                                            <h:selectBooleanCheckbox id="removeCheckBox"

                                                                     styleClass="alignCenter"

                                                                     onclick="radioButton(this,\'#{backOrderItem.backOrdqty}\');"

                                                                     value="#{backOrderItem.asnRCheckBox}"

                                                                    

                                                                    />

                                         <h:inputHidden id="backOrdqty1"  value="#{backOrderItem.backOrdqty}" />

                                           </h:column> 

                                       

                                         <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid>

                                                    <h:panelGroup layout="block" styleClass="alignLeft">

                                                        <h:outputLabel value="#{msg.qtyToCancel}" styleClass="alignLeft"/>

                                                    </h:panelGroup>

                                                   

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="qtyToCancel12"

                                                                     maxlength="10"

                                                                     size="10"

                                                                     value=""

                                                                     styleClass="hidden"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                           

                                            <h:inputText id="qtyToCancel" value="#{backOrderItem.qtyToCancel}" size="4" maxlength="4" styleClass="alignLeft"

                                             onblur="selectOneRow(this,\'#{msg.quantityToCancel}\',\'#{msg.numericOnly}\');" immediate="true"/>

                                            

                                            <h:inputHidden id="backOrdqty"  value="#{backOrderItem.backOrdqty}"/>

                                        </h:column>

                                       

                                       

                                          <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid>

                                                    <h:panelGroup layout="block" styleClass="alignLeft">

                                                        <h:outputLabel id= "boQTY" value="#{msg.backOrqty}" style ="width:40px;" styleClass="alignLeft"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="boQTY12"

                                                                     maxlength="10"

                                                                     size="10"

                                                                     value=""

                                                                     styleClass="hidden"/>

                                                    </h:panelGroup>

                                                   

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel  value="#{backOrderItem.backOrdqty}" styleClass="alignCenter"/>

                                        </h:column>

                                       

                                       

                                        <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.boDate}"

                                                                       id="size"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="bodate"

                                                                     maxlength="10"

                                                                     size="10"

                                                                     value="#{BackOrderPortletBean.searchbackOrdDate}"

                                                                     styleClass="alignLeft"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel id="backOrdDate" value="#{backOrderItem.backOrdDate}"

                                                           styleClass="alignLeft"/>

                                        </h:column>

                                       

                                       

                                       

                                       

                                         <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.item}"

                                                                       id="item"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="itemNo"

                                                                     maxlength="6"

                                                                     size="6"

                                                                     value="#{BackOrderPortletBean.searchbackOrditem}"

                                                                     styleClass="item"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel value="#{backOrderItem.backOrditem}"

                                                           styleClass="alignLeft"/>

                                                          

                                        </h:column>

                                       

                                       

                                        <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.desc}"

                                                                       id="desc"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="itemDesc"

                                                                    maxlength="120"

                                                                    value="#{BackOrderPortletBean.searchdescription}"

                                                                     styleClass="alignLeft"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel value="#{backOrderItem.description}"

                                                           styleClass="alignLeft"/>

                                        </h:column>

                                       

                                       

                                       

                                          <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.soh}"

                                                                       id="isoh"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="itemsoh"

                                                                     maxlength="6"

                                                                     size="6"

                                                                     value="#{BackOrderPortletBean.searchcustReg}"

                                                                     style ="width:40px;"

                                                                     styleClass="alignCenter"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel value="#{backOrderItem.custReg}"

                                                           styleClass="alignCenter"/>

                                        </h:column>

                                       

                                       

                                       

                                            <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.repl}"

                                                                       id="repl" style ="width:82px;"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="itemRepl"

                                                                     maxlength="8"

                                                                     size="8"

                                                                     value="#{BackOrderPortletBean.searchstopRepInd}"

                                                                     style ="width:50px;"

                                                                     styleClass="alignLeft"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel value="#{backOrderItem.stopRepInd}"

                                                           styleClass="alignCenter"/>

                                        </h:column>

                                       

                                       

                                       

                                         <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.orderDate}"

                                                                       id="oDate"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="orDate"

                                                                     maxlength="10"

                                                                     size="10"

                                                                     value="#{BackOrderPortletBean.searchwrittenDate}"

                                                                     style ="width:60px;"

                                                                     styleClass="alignCenter"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel value="#{backOrderItem.writtenDate}"

                                                           styleClass="alignLeft"/>

                                        </h:column>

                                       

                                       

                                       

                                         <h:column>

                                            <f:facet name="header">

                                                <h:panelGrid columns="1">

                                                    <h:panelGroup layout="block">

                                                        <h:outputLabel value="#{msg.orderNo}"

                                                                       id="ordNo"/>

                                                    </h:panelGroup>

                                                    <h:panelGroup layout="block">

                                                        <h:inputText id="ordNo1"

                                                                     maxlength="10"

                                                                     size="10"

                                                                     value="#{BackOrderPortletBean.searchorderNo}"

                                                                    

                                                                     style ="text-align:left; width:50px;"

                                                                     styleClass="alignCenter"/>

                                                    </h:panelGroup>

                                                </h:panelGrid>

                                            </f:facet>

                                            <h:outputLabel value="#{backOrderItem.orderNo}"

                                                           style ="text-align:left;"/>

                                        </h:column>

                                       

                                 

                                 

                                    </h:dataTable>

                                </h:panelGroup>

                             

                             

                             

                                <h:panelGroup layout="block">

                                    <h:panelGrid columns="8"

                                                 rendered="#{BackOrderPortletBean.pagination.totalRecords gt BackOrderPortletBean.pagination.pageSize}">

                                        <h:panelGroup layout="block">

                                            <h:commandButton value="<<"

                                                             action="#{BackOrderPortletBean.firstPage}"

                                                             disabled="#{BackOrderPortletBean.pagination.firstPage}"

                                                             onclick="return paginationStartValidation(\'#{msg.unsavedDataWarning}\');"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:commandButton value="<"

                                                             action="#{BackOrderPortletBean.previousPage}"

                                                             disabled="#{BackOrderPortletBean.pagination.firstPage}"

                                                             onclick="return paginationStartValidation(\'#{msg.unsavedDataWarning}\');"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:inputText id="paginationStart" styleClass="pagination"

                                                         value="#{BackOrderPortletBean.pagination.start}"

                                                         size="2" maxlength="10"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:outputText value="-"  styleClass="pagination"/>

                                            <h:outputText value="#{BackOrderPortletBean.pagination.end}"  styleClass="pagination"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:outputText value="#{msg.of}"  styleClass="pagination"/>

                                            <h:outputText value="#{BackOrderPortletBean.pagination.totalRecords}"  styleClass="pagination"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:commandButton value="#{msg.go}"

                                                             action="#{BackOrderPortletBean.gotoPage}"

                                                             onclick="return paginationStartValidation(\'#{msg.unsavedDataWarning}\');"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:commandButton value=">"

                                                             action="#{BackOrderPortletBean.nextPage}"

                                                             disabled="#{BackOrderPortletBean.pagination.lastPage}"

                                                             onclick="return paginationStartValidation(\'#{msg.unsavedDataWarning}\');"/>

                                        </h:panelGroup>

                                        <h:panelGroup layout="block">

                                            <h:commandButton value=">>"

                                                             action="#{BackOrderPortletBean.lastPage}"

                                                             disabled="#{BackOrderPortletBean.pagination.lastPage}"

                                                             onclick="return paginationStartValidation(\'#{msg.unsavedDataWarning}\');"/>

                                        </h:panelGroup>

                                    </h:panelGrid>

                                </h:panelGroup>

                                <h:panelGroup layout="block">

                                    <h:panelGrid columns="1"

                                                 columnClasses="alignRight"

                                                 styleClass="alignRight"

                                                 id="panelGrid6">

                                        <h:panelGroup layout="block">

                                     

                                       

                                            <h:commandButton value="#{msg.save}"

                                                             onclick="deleteMsg(\'#{msg.deleteMsg}\'); disableSaveButton();"

                                                             action="#{BackOrderPortletBean.saveAction}"

                                                             disabled="#{BackOrderPortletBean.saveButton}"

                                                           />

                                        </h:panelGroup>

                                     

                                    </h:panelGrid>

                                </h:panelGroup>

                            </h:form>

                       </h:panelGrid>

                    </h:panelGroup>

                </h:panelGrid>

               

            

            </body>

        </html>

    </f:view>

    ===================Portal java script=======================================

    BackorderedItem.js as follows :

    /**

      * @author Jaysing Hajare

      *

      *

      */ 

     

    /**

    * Checks if the input entered in the Item field is integer or not

    */

    function isIntValid(str) {

        var i;

        for (i = 0; i < str.length; i++) {

            // Check that current character is number.

            var c = str.charAt(i);

            if (((c < "0") || (c > "9")))

                return false;

        }

        // All characters are numbers.

        return true;

    }

    /**

    * Gets the characters typed in the date input field

    */

    function stripCharsInBag(str, bag) {

        var i;

        var returnString = "";

        // Search through string's characters one by one.

        // If character is not in bag, append to returnString.

        for (i = 0; i < str.length; i++) {

            var c = str.charAt(i);

            if (bag.indexOf(c) == -1) {

                returnString += c;

            }

        }

        return returnString;

    }

    /**

    * Conditions for February's right number of days

    */

    function daysInFebruary(year) {

        // February has 29 days in any year evenly divisible by four,

        // EXCEPT for centurial years which are not also divisible by 400.

        return (((year % 4 == 0) && ((!(year % 100 == 0)) || (year % 400 == 0))) ? 29

                        : 28);

    }

    /**

    * Function to determine if the number of days in the month is correct or not

    */

    function daysArray(dayNum) {

        for ( var i = 1; i <= dayNum; i++) {

            this[i] = 31;

            if (i == 4 || i == 6 || i == 9 || i == 11) {

                this[i] = 30;

            }

            if (i == 2) {

                this[i] = 29;

            }

        }

        return this;

    }

    /**

    * Checks if the entered date is in the right format or not

    */

    function isDate(dtStr,invaliddateFormat,invalidMonth,invalidDay,invalidYear,invalidDate,displayAlert) {

        /**

         * Declaring valid date character, minimum year and maximum year

         */

        var dtCh = "-";

        var minYear = 1900;

        var maxYear = 2100;

        var daysInMonth = daysArray(12);

        var pos1 = dtStr.indexOf(dtCh);

        var pos2 = dtStr.indexOf(dtCh, pos1 + 1);

        var strDay = dtStr.substring(pos2 + 1);

        var strMonth = dtStr.substring(pos1 + 1, pos2);

        var strYear = dtStr.substring(0, pos1);

        strYr = strYear;

        if (strDay.charAt(0) == "0" && strDay.length > 1) {

            strDay = strDay.substring(1);

        }

        if (strMonth.charAt(0) == "0" && strMonth.length > 1) {

            strMonth = strMonth.substring(1);

        }

        for ( var i = 1; i <= 3; i++) {

            if (strYr.charAt(0) == "0" && strYr.length > 1) {

                strYr = strYr.substring(1);

            }

        }

        month = parseInt(strMonth);

        day = parseInt(strDay);

        year = parseInt(strYr);

        if (dtStr == "" || dtStr == null) {

            return true;

        }

        if (pos1 == -1 || pos2 == -1) {

            if(displayAlert=="true"){

                alert(invaliddateFormat);

            }

            return false;

        }

        if (strMonth.length < 1 || month < 1 || month > 12) {

            if(displayAlert=="true"){

                alert(invalidMonth);

            }

            return false;

        }

        if (strDay.length < 1 || day < 1 || day > 31

                        || (month == 2 && day > daysInFebruary(year))

                        || day > daysInMonth[month]) {

            if(displayAlert=="true"){

                alert(invalidDay);

            }

            return false;

        }

        if (strYear.length != 4 || year == 0 || year < minYear || year > maxYear) {

            if(displayAlert=="true"){

                alert(invalidYear + minYear + " and "

                                + maxYear);

            }

            return false;

        }

        if (dtStr.indexOf(dtCh, pos2 + 1) != -1

                        || isIntValid(stripCharsInBag(dtStr, dtCh)) == false) {

            if(displayAlert=="true"){

                alert(invalidDate);

            }

            return false;

        }

        return true;

    }

    /**

    * Main function which is called when the date is typed and enter or the search button is pressed

    */

    function validateForm(invaliddateFormat,invalidMonth,invalidDay,invalidYear,invalidDate,displayAlert) {

        var dt = document.getElementById('proposalsform:proposalList:inputDate');

        if (isDate(dt.value,invaliddateFormat,invalidMonth,invalidDay,invalidYear,invalidDate,displayAlert) == false) {

            dt.value = "";

            dt.focus();

            return false;

        }

        return true;

    }

    /**

    * Checks if the Item entered is number or not

    */

    function isItemValid(invalidItem) {

        var idItmNbr = 'proposalsform:proposalList:inputItemNbr';

        myItmNbr = document.getElementById(idItmNbr).value;

        if ((isIntValid(myItmNbr)) == false) {

            alert(invalidItem);

            document.getElementById(idItmNbr).value = ""

            document.getElementById(idItmNbr).focus();

        }

    }

    /**

    * Checks if the Min input given is greater than the min value and vice versa

    */

    function isGreaterMin(obj,greaterThanOne,HighValueWarning,MinSmallerThanMax) {

        var par = obj.parentNode;

        while (par.nodeName.toLowerCase() != 'tr') {

                par = par.parentNode;

        }

        //Correction required as the index is taking +1, beacause of the table header 

        var correctedIndex = par.rowIndex - 1;

        //input text for user to update                                   

        var idMin1 = 'proposalsform:proposalList:' + correctedIndex

                        + ':minInputText';

        var idMax1 = 'proposalsform:proposalList:' + correctedIndex

                        + ':maxInputText';

        var idCMin1 = 'proposalsform:proposalList:' + correctedIndex

                        + ':centralMinHid';

        var idCMax1 = 'proposalsform:proposalList:' + correctedIndex

                        + ':centralMaxHid';

        //values for each of the input boxes

        myidMin1 = document.getElementById(idMin1).value;

        myidMax1 = document.getElementById(idMax1).value;

        myidCMin1 = document.getElementById(idCMin1).value;

        myidCMax1 = document.getElementById(idCMax1).value;

        var diff = myidMax1 - myidMin1;

        if (!myidMin1 && myidMax1 > 1) {

            if (myidCMin1 && myidCMax1) {

                alert(greaterThanOne);

                document.getElementById(idMin1).focus();

                document.getElementById(idMin1).value = myidCMin1;

            }

        } else if (myidMin1 > 0 && myidMax1 > 0) {

            if (!myidCMin1 && myidCMax1 == 1) {

                alert("Logout cannot be changed..");

                document.getElementById(idMin1).value = "";

                document.getElementById(idMin1).focus();

            }

        } else if (!myidMin1) {

            alert(greaterThanOne);

            //document.getElementById(idMin).value=""

            document.getElementById(idMin1).focus();

            document.getElementById(idMin1).value = myidCMin1;

        } else if (myidMax1 < 1 || myidMin1 < 1) {

            if (myidMin1 == myidCMin1) {

            } else {

                alert(greaterThanOne);

                document.getElementById(idMin1).value = myidCMin1;

                document.getElementById(idMax1).value = myidCMax1;

            }

        }

        if (myidMin1 > 99) {

            alert(HighValueWarning);

        }

       

        if (diff < 0) {

            alert(MinSmallerThanMax);

            document.getElementById(idMax1).focus();

            //document.getElementById(idMin1).value = myidCMin1;

        }

    }

    /**

    * Checking for Numeric values only in the min/max input fields

    */

    function isNumeric(obj,numericOnly) {

        var par = obj.parentNode;

        while (par.nodeName.toLowerCase() != 'tr') {

            par = par.parentNode;

        }

        //Correction required as the index is taking +1, beacause of the table header 

        var correctedIndex = par.rowIndex - 1;

        //input text for user to update                                   

        var idMin = 'proposalsform:proposalList:' + correctedIndex

                        + ':minInputText';

        var idMax = 'proposalsform:proposalList:' + correctedIndex

                        + ':maxInputText';

        var idCMin1 = 'proposalsform:proposalList:' + correctedIndex

                        + ':centralMinHid';

        var idCMax1 = 'proposalsform:proposalList:' + correctedIndex

                        + ':centralMaxHid';

        //text box values

        myidMin = document.getElementById(idMin).value;

        myidMax = document.getElementById(idMax).value;

        myidCMin1 = document.getElementById(idCMin1).value;

        myidCMax1 = document.getElementById(idCMax1).value;

       

        //valiadte if they are numeric or not

        if ((isIntValid(myidMin)) == false) {

            alert(numericOnly);

            document.getElementById(idMin).value=myidCMin1;

            document.getElementById(idMin).focus();

        }

        if ((isIntValid(myidMax)) == false) {

            alert(numericOnly);

            document.getElementById(idMax).value=myidCMax1;

            document.getElementById(idMax).focus();

        }

    }

    /**

    * Function to get details from the row that is selected from the data table

    */

    function addOnclickToDatatableRows(obj) {

        var par = obj.parentNode;

        while (par.nodeName.toLowerCase() != 'tr') {

                par = par.parentNode;

        }

        //Correction required as the index is taking +1, beacause of the table header 

        var correctedIndex = par.rowIndex - 1;

        //show the default min/max labels also

        //defaults this is read only

        var defaultMinValue = 'proposalsform:defaultMinValue1';

        var defaultMaxValue = 'proposalsform:defaultMaxValue1';

        //hiddden text to hold the central min/max

        var idCMin = 'proposalsform:proposalList:' + correctedIndex

                        + ':centralMinHid';

        var idCMax = 'proposalsform:proposalList:' + correctedIndex

                        + ':centralMaxHid';

        var idLMinUpd = 'proposalsform:proposalList:' + correctedIndex

                        + ':localMinHidUpd';

        var idLMaxUpd = 'proposalsform:proposalList:' + correctedIndex

                        + ':localMaxHidUpd';

        //input text for user to update                                   

        var idMin = 'proposalsform:proposalList:' + correctedIndex

                        + ':minInputText';

        var idMax = 'proposalsform:proposalList:' + correctedIndex

                        + ':maxInputText';

        //check boxes

        var idAccept = 'proposalsform:proposalList:' + correctedIndex

                        + ':acceptCheckBox';

        var idReject = 'proposalsform:proposalList:' + correctedIndex

                        + ':rejectCheckBox';

        var idOverride = 'proposalsform:proposalList:' + correctedIndex

                        + ':overrideCheckBox';

        var valHiddenCMin = document.getElementById(idCMin).value;

        var valHiddenCMax = document.getElementById(idCMax).value;

        var valHiddenLMinUpd = document.getElementById(idMin).value;

        var valHiddenLMaxUpd = document.getElementById(idMax).value;

        //when override is unchecked -- uncheck accept, and make the input box read only --

        if (document.getElementById(idOverride).checked != true) {

            document.getElementById(idMin).value = document.getElementById(idCMin).value;

            document.getElementById(idMax).value = document.getElementById(idCMax).value;

            document.getElementById(defaultMinValue).value = "";

            document.getElementById(defaultMaxValue).value = "";

            document.getElementById(idAccept).disabled = obj.checked;

            document.getElementById(idAccept).checked = obj.checked;

            //then set the lcoal min back to the central min/max

            document.getElementById(idLMinUpd).value = "";

            document.getElementById(idLMaxUpd).value = "";

            document.getElementById(idMin).disabled = true;

            document.getElementById(idMax).disabled = true;

        } else {

        //when override is checked -- check accept and make is disabled and remove the reject chck if present

       

            document.getElementById(idAccept).disabled = obj.checked;

            document.getElementById(idAccept).checked = obj.checked;

            document.getElementById(idReject).checked = false;

            //setting the default C min/max based on the override checkbox click

            document.getElementById(defaultMinValue).value = valHiddenCMin;

     

  • Daniel Merchán
    Daniel Merchán Enterprise Achitect Member Posts: 2,192 Gold Trophy
    edited Oct 28, 2019 4:03AM

    Hi,

    As I said before, create JSF Backing Beans

    <h:selectBooleanCheckbox id="removeCheckBox" binding="#{myPortletBacking.removeCheckBox}"/>

    In your Java you can have

    public class PortletBacking {

       private HtmlSelectBooleanCheckbox removeCheckBox;

       // constructor

       ...

       // setters and getters

       ....

       // auxiliar methods

       public String getRemoveCheckBoxClientId() {

          return this.removeCheckBox.getClientId();

       }

    }

    In you invocation to JavaScript you can send the generated clientId

    onclick=(\'{#removeCheckBox.clientId}\')

    Using the above technique you will be safe of autogenerated IDs.

    Just a personal feedback: If you have time, I will re-do completely this Portlet. It is a extreme mix of JSF and JS which does not make any sense.

    Kind regards.

  • User_LWFOQ
    User_LWFOQ Member Posts: 78 Blue Ribbon
    edited Nov 6, 2019 2:53AM

    Hi Daniel,

    Thank you so much...

    You have mentioned in Just a personal feedback: If you have time, I will re-do completely this Portlet. It is a extreme mix of JSF and JS which does not make any sense.

    Please let me when you are free so that we can re-do portlet completely.

    in this case we need  recreate portlet  once gain as we have 10  portlet all need to recreate and a lot of java script code.

    What is your suggestion for the same .

    If we don't use java script separately then need to  include in jsp/jsf page .

    Please let me when you are free so that we can re-do portlet completely.

    Thank you so much  again...

    Thanks,

    Jaysing

  • Daniel Merchán
    Daniel Merchán Enterprise Achitect Member Posts: 2,192 Gold Trophy
    edited Nov 13, 2019 3:19AM

    Hi,

    Maybe I have explain myself wrong, I would suggest you and your team analyse and make a re-factor of the Portlet or next Portlets or future Portlets you try to improve. (learning is always good )

    I can give some best practice and guidance for future ones.

    I cannot compromise my time doing this as I am also an employee in his projects with limited time .

    Kind regards.