Forum Stats

  • 3,733,859 Users
  • 2,246,831 Discussions
  • 7,856,898 Comments

Discussions

Set Focus on CreateINsert row in ADF Table

Umer Farooq
Umer Farooq Member Posts: 28
edited August 2017 in JDeveloper and ADF

Dear All.

I am using Jdeveloper 12c 12.2.1.2

I want to set focus on newly created row in adf table. I have followed following article.

Andrejus Baranovskis Blog: Improving ADF UI Table CRUD Functionality with Auto Focus

After migrating to 12.2.1.2 this code is still working and the focus is placed in the correct field. but after filling in the EmployeeId and hitting the TAB-key, the input focus is lost, and not placed into the next input field. Any suggestions.

Regards,

Umer Farooq

Tagged:
Daniela Vintu

Answers

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 37,082 Red Diamond
    edited January 2017

    Have you checked that the focusID which should be the ID of the next field is correct?

    Timo


  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017

    Yes sir I checked. Also Focus Id is setting correctly and it is also working as per requirement. Problem is after that(When focus is set on required field) on Press Tab Button focus should move to next field. But it does not. Instead it is lost.

  • managed BEAN
    managed BEAN Member Posts: 945
    edited January 2017

    Hello @Umer Farooq

    I had similar problem.

    Try to set t.focus(); twice in your javascript function, and let me know if it worked.

    Regards,

    Carlos

  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017

    @managed BEAN still same result. What I think is by setting focus forcefully, ADF Table lose its internal focus sequence.

  • managed BEAN
    managed BEAN Member Posts: 945
    edited January 2017

    Ok.

    Let´s see.

    Are your requirements to use af:table component compulsory?

    My personal solution (besides double the focus) was to use af:iterator (but af:list also worked), and in the meantime i also used this link: Blog on Software and Beyond it: Set Initial Focus component for Oracle ADF Faces , wich is not mandatory(the major thing in that example is the double focus), but i let it in my code because its used as a component.

    Check my code:

    <af:iterator id="payIter" value="#{viewScope.paymentsTableBean.paymentsTable}" var="item"                         binding="#{viewScope.salePaymentsBean.payIterator}">                <af:panelGroupLayout id="pb1" layout="horizontal">                    <h:outputLabel value="#{labelsVar['LBL-0146']} #{item.index}:" id="ol1" styleClass="paymentLabel"/>                    <af:selectOneChoice id="iteratorTypeCombo" value="#{item.type}" autoSubmit="true"                                        disabled="#{item.index le viewScope.salePaymentsBean.disabledIndex}">                        <?audit suppress oracle.jdeveloper.jsp.validate-children?>                        <f:selectItems value="#{viewScope.salePaymentsBean.paytypeList}" id="si1"/>                        <af:clientListener method="changedPaymentTypeEnter" type="keyUp"/>                        <af:serverListener type="typeFocusListener"                                           method="#{viewScope.salePaymentsBean.paymentTypeChange}"/>                        <ADF-Extensions:setInitialFocus/>                    </af:selectOneChoice>                    <af:inputText value="#{item.amount}" id="iteratorAmount" autoSubmit="true"                                                                    disabled="#{item.index le viewScope.salePaymentsBean.disabledIndex or item.type eq null or item.index ge viewScope.salePaymentsBean.maxNrPayments}"                                  binding="#{viewScope.salePaymentsBean.paymentValueIT}">                        <af:validateDoubleRange minimum="0.01" maximum="#{viewScope.salePaymentsBean.remainingValue}"/>                        <f:convertNumber minFractionDigits="#{currentSessionBean.decimalDigits}"                                         maxFractionDigits="#{currentSessionBean.decimalDigits}"/>                        <af:clientListener method="changedValueEnter" type="keyUp"/>                        <af:serverListener type="valueFocusListener"                                           method="#{viewScope.salePaymentsBean.paymentValueChange}"/>                    </af:inputText>                    <af:link id="linkDelPaym" icon="/resources/images/sales/delete.png"                             actionListener="#{viewScope.salePaymentsBean.deletePayment}"                             rendered="#{item.index gt viewScope.salePaymentsBean.disabledIndex and viewScope.salePaymentsBean.disabledIndex ne 0}"/>                </af:panelGroupLayout>            </af:iterator>

    Also, my data is not coming from DC but programmatically from bean.

    Ah, i used Enter key, but that´s evaluated in javascript:

    function changedValueEnter(evt) {    var keyCode = evt.getKeyCode();    var inputText = evt.getSource();    //check for Enter Key    if (keyCode == AdfKeyStroke.ENTER_KEY) {        var source = evt.getSource();        AdfCustomEvent.queue(source, "valueFocusListener",         {value:inputText.getSubmittedValue()},        false);        evt.cancel();    }}

    Regards,

    Carlos

  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017

    Dear Carlos,

    Thanks for your reply. We have to use af:table as we have already done lot of development on number of forms.

    Secondly I have changed my client script according to your example but result is still same.

    Any help or clue will be highly appreciated. I am in final stages of project and this is must requirement of my client.

    Regards,

    Umer Farooq

  • managed BEAN
    managed BEAN Member Posts: 945
    edited January 2017

    Hello @Umer Farooq

    Sorry. I´m lack of ideas.

    The only hint that i can give now (cause nothing else worked) is that i had to clean code (old stuff and references i didn´t use no more in bean) and only then the example i gave you worked.

    But my case was that i was changing the components from one thing to another(ended up to be af:iterator), and you only migrated from something which was working...

    Best of luck,

    Carlos

  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017

    Dear Carlos

    Thanks a lot for your effort.

  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017

    Do anyone have experience of using jquery with ADF.

    Any helpful hint/workarround will be appreciated.

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 37,082 Red Diamond
    edited January 2017

    Umer, can you provide a reproducible testcase ( ) for this?

    Timo


  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017

    Dear Sir,

    To reproduce this issue. Simply download application mentioned in following article. and migrate this application to Jdeveloper 12.2.1.2. After that it moves focus on newly created row field. That is as per requirement. But on hitting the TAB-key, the input focus is lost, and not placed into the next input field. It must move to next input field.

    Andrejus Baranovskis Blog: Improving ADF UI Table CRUD Functionality with Auto Focus

  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited January 2017
  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 37,082 Red Diamond
    edited January 2017

    I guess your last option is to open a SR with support.oracle.com (payable support contract needed) and let them work on this.

    Timo


  • Muhammad.Rizwan
    Muhammad.Rizwan Member Posts: 552
    edited January 2017

    Hi Umer,

    you can try following

    1. go to xml page, then clean/make project. do this while server is stopped.

    2. check if there is duplicate field name

    3. try setting focus to some other field.

    4. Check properties of next field. e.g.it's not disabled, read-only etc?

    5. If everything looks ok, try removing the field and re-create it.

        first re-create with same id, if it doesn't work, try creating it with different id.

    good luck!

  • Timo Hahn
    Timo Hahn Senior Principal Technical Consultant - Oracle ACE Director Member, Moderator Posts: 37,082 Red Diamond
    edited January 2017

    @Muhammad.Rizwan have you tried this with the sample application? Did this work?

    Timo


  • Muhammad.Rizwan
    Muhammad.Rizwan Member Posts: 552
    edited January 2017

    Hi Timo,

    No, I haven't tried this but had similar issues in the past and one of the work arounds did the trick for me.

  • Jonas de Graaff (CACI)
    Jonas de Graaff (CACI) Member Posts: 10 Blue Ribbon
    edited February 2017

    Umer,

    I ran into the same issue. The fact that your TAB-key is not working anymore is caused by the fact that the table is not in 'Action mode'. Since 12c, there is a whole new keyboard and focus management that is based in the accessibility requirements from the WAG 2.0 guidelines. Please read the 'editmode' section of the following documentation to understand how it should work according to Oracle:

    http://jdevadf.oracle.com/adf-richclient-demo/docs/tagdoc/af_table.html

    This leaves the functional requirement that you want to place the cursor in the new row automatically. I've filed a SR with this question and I'm currently waiting for the answer.

    Regards,

    Jonas

  • Om Pathak
    Om Pathak Member Posts: 2
    edited March 2017

    Hi Jonas,

    We too are facing the similar issue as reported in this thread.

    Did you get a reply for the Oracle SR?

    Regards,

    Om

  • Gijith
    Gijith Member Posts: 117
    edited April 2017

    Dea Umer and , @Muhammad.Rizwan @Timo Hahn @managed BEAN

    I am also facing the same problem with Jdeveloper Version 12.2.1.1.0. This problem i am facing from version 11gR1 & 11gR2. Now its in 12C also.

    Did you get any solution or SR for this issue. ?

    I think this a birth defect of ADF table. Because i am adding an additional point here. That is even though you are not using any custom Java script in adf table this issue of TAB out will happen if any column in the table have component with autosubmit=true.

    Autosubmit is a property of all ADF component. So by setting it to true why ADF table TAB out behaves strange? It should work properly right ? But till now there is no solution or workaround for this. That is why i mentioned it as a birth defect of ADF Table. The same mistake may be propagating to every version of ADF and Oracle may be unaware or still standing surprised upon this in all these years..

    All Gruru's in this forum have no solution for this yet.  All are telling to use Editable form instead of ADF table. Then why they provided Editable Table component ?. Just for seeing in component list ? So, i think ADF Era is gonna end.

    If any Guru's have contradiction then just say us the solution.

    Just for an example . You can download a sample application from https://technology.amis.nl/2016/03/15/navigating-adf-editable-table-arrow-keys/  ( This is the blog just i got with a sample now) or you can create a simple page with ADF table . And then give auto submit to any of the column and see what i said.

    Enjoy.

    Regards,

    Gijith.

  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited July 2017

    Hi John,

    Did you got the reply.

  • William Perez Soto-Oracle
    William Perez Soto-Oracle Member Posts: 16 Employee
    edited July 2017

    As Jonas indicated, TAB key navigation in 12c changed. Behavior change to meet WCAG 2.0 and now navigating within the table cells by TAB constitute a trap, hence is disabled by default.

    Workaround in 12c is to set the focus on the cell, then end-user press F2 or ENTER key, this causes the table to enter Actionable Mode and focus moves from the cell to the input field, and while in Actionable Mode when user press TAB, now the focus will move to the next input field.

  • Robert Šajina
    Robert Šajina Member Posts: 94
    edited August 2017

    Hi,
    So the solution is pretty simple

    The procedure is the same as explained here: Andrejus Baranovskis Blog: Improving ADF UI Table CRUD Functionality with Auto Focus

    We have found that the solution is to expand the javascript code suggested by Andrejus, so the function for focusing row and field would look like:

    function setFocusByComponentId (id){                  var input = AdfPage.PAGE.findComponentByAbsoluteId(id);            var table = input.getParent();                      input.focus();                      setTimeout(function(){                table.simulateSelectRows(table.getActiveRowKey().toString(),'');             },0);        }
  • Umer Farooq
    Umer Farooq Member Posts: 28
    edited August 2017

    Dear ,

    Thanks for reply but following javascript script throwing exception.

    TypeError: table.getActiveRowKey(...) is null

    Can u please check your browser version. I am using firefox. Thanks

    Umer Farooq

  • Robert Šajina
    Robert Šajina Member Posts: 94
    edited August 2017

    The table is not getting the right row as active. You have to set active row in java, and than you would be able to set focus on current row.
    It has nothing to do with Browser type.
    In our application we are programmaticlly adding row and setting the current active row.
    If you were using Andrejus sample application, there he is executing operation binding, so ADF is doing the insert.
    So in order this to work you just need to add the following line in the for loop:

    table.setActiveRowKey(selectedRowKey);

    So the function in GenericListener is next:

        public void genericActionListener(ActionEvent actionEvent) {        UIComponent comp = actionEvent.getComponent();        String actionName = (String)comp.getAttributes().get("actionName");                OperationBinding ob = ADFUtils.findOperation(actionName);        if (ob != null) {            ob.execute();        }                RichTable table = this.getRichTableBinding(comp);        if (table != null) {            RowKeySet selection = table.getSelectedRowKeys();            for (Object selectedRowKey : selection) {                String focusComponentTarget = (String)comp.getAttributes().get("focusComponentTarget");                table.setActiveRowKey(selectedRowKey);//this is added to make selection                FacesContext context = FacesContext.getCurrentInstance();                String rowId = table.getClientRowKeyManager().getClientRowKey(context, table, selectedRowKey);                String tableClientId = table.getClientId(context);                String focusId = tableClientId + ":" + rowId + ":" + focusComponentTarget;                                LOGGER.finest("Focus ID: " + focusId);                                ExtendedRenderKitService erks = Service.getService(context.getRenderKit(), ExtendedRenderKitService.class);                erks.addScript(context, "setFocusByComponentId('" + focusId + "')");            }        }    }    

    For us, this works flawlessly with clickToEdit property on table(editingMode). But it should be working on editAll, although its now fully tested.

    Daniela Vintu
This discussion has been closed.