How do I focus a field on the window modal?

How do I focus a field on the window modal?

FreelancerAccFreelancerAcc Posts: 8Questions: 0Answers: 0
edited April 2013 in Editor
The default setting is to focus the first field of the modal window.
How do I manually focus another one?

Replies

  • allanallan Posts: 63,498Questions: 1Answers: 10,470 Site admin
    [code]
    $( 'input', editor.node( 'myField' ) ).focus();
    [/code]

    should do it.

    Regards,
    Allan
  • FreelancerAccFreelancerAcc Posts: 8Questions: 0Answers: 0
    I tried to use the focus 'onOpen' it works at first but after a sec it gets right back at the first field from the modal window.
  • allanallan Posts: 63,498Questions: 1Answers: 10,470 Site admin
    I think the problem is the animation of the modal fading it. The internal event handler is being executed when the modal has faded in, which is after onOpen. I'd suggest making a small change to the create and edit methods to disable their call to focus() if you don't want that.

    Allan
  • agustin_garciaagustin_garcia Posts: 17Questions: 0Answers: 0
    Hi Allan,
    I'm trying the following code, but even the alert is displayed, I don't get the focus back to the field I need.
    If an invalid numbers is entered, error message is displayed and keep focus on the same field, until a valid number is entered

    NOTE: I removed the alert as a test, but still the focus is being lost

    $( 'input', editor.node( 'remaining_amount' ) ).on( 'blur', function () {
    if ( isNaN( editor.get( 'remaining_amount' ) ) ) {
    alert('Remaining amount shoud be a valid number');
    $( 'input', editor.node( 'remaining_amount' ) ).focus();
    }
    } );
  • allanallan Posts: 63,498Questions: 1Answers: 10,470 Site admin
    Are ou able to link me to the page? It looks to me that your code there should be working.

    Allan
  • agustin_garciaagustin_garcia Posts: 17Questions: 0Answers: 0
    Try http://a4enterprise.com/pfm/index.php?option=com_pfm
    Select "Expenses tab", then "Liabilities and Debt" tab
    Try editing any of the records there.

    NOTE: You may need to click on any of the table headers (e.g. User Name) to be able to view the DataTable's content (I still need to check why this behavior happens for some DT while other display all the records automatically)
  • agustin_garciaagustin_garcia Posts: 17Questions: 0Answers: 0
    BTW, I'm testing this on field: "Remaining Amount"
  • agustin_garciaagustin_garcia Posts: 17Questions: 0Answers: 0
    Hello,
    I was able to make it work. The code itself was OK, but I was dragging another error that stated that the space on the table defined by "sScrollXInner" won't fit for 3 other tables, as asked me to either increase it or remove the command. Below is what I had, as soon as I removed the ""sScrollXInner": "150%",", the focus command works perfectly

    [code]
    $('#exp_liabilities').dataTable( {
    "sScrollX": "100%",
    "sScrollXInner": "150%",
    "sDom": "Tfrtip",
    ...
    [/code]
This discussion has been closed.