Discussions

Expand all | Collapse all

Using JavaScript Add Onblur to Form Element

  • 1.  Using JavaScript Add Onblur to Form Element

    Posted 01-25-2019 19:28
    Dan Diebolt, this one's for you (or anyone else that can answer!).

    Using IOL in a form, I want to add an EventListener for onblur on a rich text field. I've been trying to get it to work, but it keeps firing as soon as the page is loaded.

    How could I do this?


  • 2.  RE: Using JavaScript Add Onblur to Form Element

    Posted 01-26-2019 02:07

    When you enter text into a Rich Text Field with fid=6 you are not directly entering text into the <textarea id=_fid_6 name=_fid_6></textarea>. Rather you are entering text into the <div> following the <textarea>. This <div> is content editable and the text you enter is only associated to the <textarea> form element when the form is submitted. So to detect when the <div> is blurred you have to use code similar to this:
    $("#_fid_6 + div").on("blur", function() {
      console.log(this.innerHTML)
    });
    Notes:

    (1) It may seem unusual but it is common for Rich Text Editors (QuickBase uses ACE) to have text entered into an element different from the form element that will get submitted with the form submits.

    (2) The selector "#_fid_6 + div" uses the "+" sign as the adjacent sibling selector.


  • 3.  RE: Using JavaScript Add Onblur to Form Element

    Posted 01-28-2019 18:56
    Thanks Dan!