Loading ...
Sorry, an error occurred while loading the content.

Autocomplete inline editor - problem handling blur event

Expand Messages
  • vino_gallantguy
    Hi , I have created an autocomplete inline text editor for my datatable, which works absolutely fine for me. Barring one blocking issue. Scenario : 1) I have
    Message 1 of 1 , Nov 9, 2009
    • 0 Attachment
      Hi ,

      I have created an autocomplete inline text editor for my datatable, which works absolutely fine for me.
      Barring one blocking issue.

      Scenario :

      1) I have clicked on the cell and the editor - textbox has popped up
      2) Now I make the text box empty - (But not saved)
      3) I click on some other cell - ( Blur )
      4) The editor remains opened, even if i scroll over to other columns and rows

      To address the above , I have over riddedn the handleDisabledBtns function() and I do a save.
      This works perfect. But, how do I deal with this if the text box is empty

      Now - the editor needs to close and a) save the new value or b) save the old val if the editor was empty

      Please let me know if I was not clear enough. Would try to add more clarity.

      Regards,
      Vinoth

      // AUTOCOMPLETE CODE START

      YAHOO.widget.TextAutoComplete = function (oConfigs) {

      this._sId = "yui-textautocomplete" + YAHOO.widget.BaseCellEditor._nCount++;
      oConfigs = oConfigs || {};
      oConfigs.type = 'textautocomplete';
      YAHOO.widget.TextAutoComplete.superclass.constructor.call(this, oConfigs);

      };

      YAHOO.lang.extend(YAHOO.widget.TextAutoComplete, YAHOO.widget.TextboxCellEditor, {

      autocomplete: null,
      autocompleteUrl: null, //set this in your editorOptions to the datasource URL
      autocompleteFields: null, //set this in your editorOptions to the expected fields for the datasource
      render: function () {
      YAHOO.widget.TextAutoComplete.superclass.render.call(this);
      },


      handleDisabledBtns : function() {

      YAHOO.util.Event.addListener(this.textbox, "blur", function(v){
      alert("Save on blur : <<" + this.textbox.value + ">>")
      if(this.textbox.value != ''){
      this.save();
      }
      else{
      return;
      }
      }, this, true);

      },

      renderForm: function () {

      YAHOO.widget.TextAutoComplete.superclass.renderForm.call(this);
      var elAutocomplete;
      elAutocomplete = this.getContainerEl().appendChild(document.createElement("div"));
      elAutocomplete.id = "autoCompleteDiv";
      elAutocomplete.style.width = "120px"; //need to set dimensions so editor and autocomplete do not fill the screen
      //elAutocomplete.style.top = "30px";
      //elAutocomplete.style.backgroundColor = "WHITE";
      this.getContainerEl().style.width = "35px";
      this.getContainerEl().style.height = "1px";
      this.getContainerEl().style.position = "absolute"; //needed for IE to display in the right place
      this.autocomplete = elAutocomplete;

      if(this.disableBtns) {
      this.handleDisabledBtns();
      }


      },

      show: function () {
      YAHOO.widget.TextAutoComplete.superclass.show.call(this);
      var autoComplete = 'companyCode';
      ds = new YAHOO.util.LocalDataSource(this.autocompleteUrl);

      configs = {
      prehighlightClassName: "yui-ac-prehighlight",
      forceSelection: true,
      useShadow: true,
      queryDelay: 0,
      minQueryLength: 0,
      animVert: .01,
      maxResultsDisplayed: (this.autocompleteUrl.length)

      };

      ac = new YAHOO.widget.AutoComplete(this.textbox, this.autocomplete, ds, configs);

      toggler = YAHOO.util.Dom.get("vtoggleB");

      pushButtonB = new YAHOO.widget.Button({container:toggler});

      vtoggleB = function(e) {

      //YAHOO.util.Event.stopEvent(e);
      if(!YAHOO.util.Dom.hasClass(toggler, "open")) {
      YAHOO.util.Dom.addClass(toggler, "open")
      }
      // Is open
      if(ac.isContainerOpen()) {
      ac.collapseContainer();
      }
      // Is closed
      else {
      ac.getInputEl().focus(); // Needed to keep widget active
      setTimeout(function() { // For IE
      ac.sendQuery("");
      },0);
      }
      };

      pushButtonB.on("click", vtoggleB);
      ac.containerCollapseEvent.subscribe(function(){YAHOO.util.Dom.removeClass(toggler, "open")});
      }

      });
      YAHOO.lang.augmentObject(YAHOO.widget.TextAutoComplete, YAHOO.widget.TextboxCellEditor);
      YAHOO.widget.DataTable.Editors.TextAutoComplete = YAHOO.widget.TextAutoComplete;

      // AUTOCOMPLETE CODE TRIAL END
    Your message has been successfully submitted and would be delivered to recipients shortly.