如何动态绑定用户定义的变量 [英] How to bind user defined variable dynamically

问题描述

截至目前，我已经创建了以下代码 -

As of now, I have a created a below code -

function autoFilter(selfObject, addFilter, dataSource, headerStartsAt ) {

  this.init = function() {
    var filterHolder = document.createElement('DIV');
    filterHolder.id = 'filterHolder';
    dataSource.parentNode.insertBefore(filterHolder, dataSource);
    var filterContent = '<span style="float: left;">Filter By: <select id="CmbSearch">' + 
        '<option value="-1">Global Search</option>';
    var MetaData = [];
    // logic for creating MetaData goes here
    for(var i = 0, j = MetaData.length; i < j; i++ ) {
      if(MetaData[i] == null) continue;
      filterContent += '<option value="' + MetaData[i].columnIndex + '">' + MetaData[i].columnLabel + '</option>';
    }
    filterContent += '</select><input  önkeyup="' + selfObject + '.filterTable(this, \'' + 
        dataSource.id + '\', this.previousSibling.value,' + headerStartsAt + ')" type="text">';
    filterContent += '<input type="button" value="Clear"  önclick="this.previousSibling.value = \'\'; ' + 
        'this.previousSibling.onkeyup();"></span>';
    filterContent += '<span id="TotalCount" style="float: right;">Total Records - ' + 
        (dataSource.rows.length-headerStartsAt) + '</span>';
    filterHolder.innerHTML = filterContent;
  }

  this.filterTable = function(phrase, tableId, searchIn, headerStartsAt) {
   // code for filter table here
  }

  if(addFilter) {
    this.init();
  }
}

上述代码的目的是动态地将搜索工具添加到exisitng表中而不需要额外的努力。



开发人员只需要跟随以下行添加此搜索/过滤设施。

The objective of above code is to add search facility dynamically to the exisitng table without extra effort.

Only following line is required to be included in by the developer to add this search/filter facility.

var anyUserObject = new autoFilter('anyUserObject', true, document.getElementById('myDataTable'), 1);

或低于1也是有效用法 -

Or below one is also valid usage -

var someObject = new autoFilter('someObject', false, document.getElementById('otherDataTableXYZ'), 3);
document.getElementById('myFilterButton').onClick = someObject.init();

从上面的代码中，我在带下划线的部分出现问题 - selfObject参数。



正如您在init函数中看到的那样，selfObject被动态地用于形成HTML字符串，它将执行onKeyUp事件。要将此搜索工具添加到页面上的多个表/网格，我需要捕获用于创建此对象的所有用户定义变量，以便可以在动态生成的HTML字符串中使用这些变量。



问题：

有没有更好的方法可以避免开发人员将变量名称作为参数传递？

或者，如何绑定/使用动态生成的代码调用Object中的公共方法？



请指教。



谢谢。

Niral Soni

From the above code, I have a problem in the portion which is underlined - the selfObject parameter.

As you can see in the init function, the selfObject is dynamically used to form HTML string, which will execute onKeyUp event. And to add this search facility to multiple table/grid on the page, I need to capture all user defined variables used for creating this object so that those variables can be used in the dynamically generated HTML string.

Question :
Is there any better way of avoiding developers to pass the name of the variable as parameter ?
Or, how to bind/invoke public method within an Object with a dynamically generated code ?

Please advise.

Thanks.
Niral Soni

推荐答案

在上查看jquery 。它还处理尚未创建的元素上的事件。

http://api.jquery.com/on/ [ ^ ]



祝你好运！

Check out jquery on. It also handles events on elements not yet created.
http://api.jquery.com/on/[^]

Good luck!

这篇关于如何动态绑定用户定义的变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！