JQuery和editableSelect包不允许我用RegExp过滤选择菜单.JavaScript和jQuery新手或

下面是一个使用PHP、MariaDB和HTML构建的选择列表:

echo "<select name='companylist' id='companylist' size='86' value='' tabindex='1' >";
echo "<option value=''></option>";
echo "<option value='0-Create a New Company'>0-Create a New Company</option>";
foreach ($companyResult as $company) {
echo "<option id='".$company['Company_Key']."' 
value='".$company['Company_Key']."'>".$company['Company_Names']."</option>";
}
echo "</select>";

它构建了一个适合我的应用程序的下拉列表。

接下来，我构建了这个测试脚本，以确定我是否在正确的轨道上使用RegExp来动态过滤下拉选择列表，并且它工作得很好，达到了它的目的。我只建立它，因为它后面的列表让我感到不适。

echo "<script>";
echo "$('#companylist option').each(function() {
var Val = this.text;
var Filter='W';
var CompRegex = new RegExp('^'+Filter);
if(CompRegex.test(Val)){
console.log('RegExp with Filter has found the following Val starting with this 
Filter: '+Filter);
console.log('Val = ' + Val);
}
})";
echo "</script>";

上面的命令给了我以下控制台输出:RegExp with Filter找到了以下以这个Filter开头的Val瓦尔=韦尔奇瓷砖RegExp with Filter找到了以下以这个Filter开头的ValVal =西密歇根模塑RegExp with Filter找到了以下以这个Filter开头的ValVal = MI的WL成型这是一个好的开始。

echo "<script>";
echo "  $('#companylist')";
echo "    .editableSelect()";
echo "    .on('select.editable-select', function (e, li) {
console.log('value = ' + document.getElementById('companylist').value);
console.log('li.val() = '+li.val());
getCustomer_Names(li.val());
getTool_Numbers(li.val());
getPart_Name(li.val());
newCompany_Name();
})";
echo "</script>";

一旦用户选择了一个项目，上面的脚本就像预期的那样加载其他菜单。

这里的下一个脚本根本不会让我获得用户在列表中看到的选项文本。我有5天的时间，因为我是JQuery新手，也不是Javascript高手，但我确实阅读了各种各样的网站寻求帮助，包括参考指南和支持板(谢谢你的这个!)，但我希望很快有一个快乐的结局。如前所述，任何帮助都将不胜感激。

echo "<script>";
echo "  $('#companylist')";
echo "    .editableSelect()";
echo "    .on('input.editable-select', function () {
$(this).each(function() {
var Val = this.text;
var Filter = this.value;
var CompRegExp = new RegExp('^'+Filter);
console.log('Val = '+Val);
console.log('Filter = '+Filter);
console.log('CompRegExp = '+CompRegExp);
if(CompRegExp.test(Val)){
console.log('RegExp with Filter has found the following Val starting with this 
Filter: '+Filter);
console.log('Val = ' + Val);
}
else {
// remove from select list
}
});
});";
echo "</script>";

上面的脚本给了我

Val = undefined
Filter = a
CompRegExp = /^a/

它是"Val = undefined"那是我的失败。

我也对这个问题采取了长远的看法，并编写了一个jQuery/JavaScript程序，清除下拉列表，然后通过PHP程序重新查询数据库以获得与SQL LIKE 'Input%'匹配的值来重新创建选项，我将包括在这里向您展示努力的深度。这里的问题是，我无法得到下拉菜单保持打开，即使我发出。editableselect ('show');按照editableSelect git网站上的指示，打开下拉菜单并显示修改后的列表，但是，如果我在字段中单击并移动光标，它会弹出菜单，其中的值与MariaDB的返回值相匹配。它遵循:

echo "<script>
function getCompany_Names(comp_val)
{
if(document.getElementById('companylist').value.substring(0,8) != '0-Create'){
$('#companylist').editableSelect('clear');
var xhttp;
if (comp_val === null || comp_val === '' ) {
$('#companylist').editableSelect('add', '<option value=></option>');
$('#companylist').editableSelect('add', '<option value=0-Create a New Company>0-Create a 
New Company</option>');
}
xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
var select = $('#companylist');
var c_text = this.responseText;
console.log('comp_ctext = ' + c_text);
c_text = JSON.parse(c_text);

$.each($(c_text),function(key,value){
if (value.compname == 'One or more Company Names are Probably Not Entered.')
{
$('#companylist').editableSelect('add','<option value=' + 'One or more Company 
Names are Probably Not Entered.' + '>One or more Company Names are Probably Not 
Entered.</option>');
}
else
{
console.log('<option id='' + value.compkey + '' value='' + value.compkey + ''>' 
+ value.compname + '</option>');
$('#companylist').editableSelect('add','<option id='' + value.compkey + '' 
value='' + value.compkey + ''>' + value.compname + '</option>');
}
}); // end .editableSelect('add',...)
}
};
xhttp.open('GET', 'getCompany_Names.php?q='+comp_val, true);
xhttp.send();
}
}

</script>";

这都是因为我的赞助人不喜欢editableSelect包的默认过滤行为，它匹配输入到下拉菜单中任何位置的任何值，并希望一些下拉菜单从第一个字符开始匹配输入到结果，类似(完全类似)/^input_variable/的正则表达式。

感谢您的宝贵时间。

这不是一个解决方案，只是更容易问…我稍后会删除更多

我不明白这个语法:.on之前没有选择器??

.on('input.editable-select', function () {
$(this).each(function() {

我看到$(this)这意味着你有更多的输入?

下面这些行的问题:

var Val = this.text;
var Filter = this.value;

Val是什么?因为this.text不能用于输入?(这就是Val =>未定义)

this.value给出了输入

时输入的内容

这比我的核心问题实际要复杂得多。我已经发布了另一个问题，这只是我的实际失败。地址:[https://stackoverflow.com/questions/66801231/the-use-of-https-github-com-indrimuska-jquery-editable-select-for-editable-sel]

我想我有一个示例页面的创建者放在一起的例子，它有一个功能，他们的我只是刚刚开始理解，但它都是关于添加值到列表。我将研究它，并把我的结果发布在核心问题页面上。感谢所有试图帮助我的人。为了简洁，这里有一个。

相关内容

最新更新

热门标签：