Question

我有两个下拉列表从数据库中获取值：

Table_Buildings

| ID | --- | building_name |

Table_Floors

| id | --- | Floor_name | --- | building（table_Buildings的外键）|

以我的形式

下拉：建设）

$db->setQuery("SELECT buildings.building_name, floors.id 
               FROM buildings 
               INNER JOIN floors 
               ON buildings.id=floors.id"

下拉：地板）

$db->setQuery("SELECT floor_name, id FROM floors");

为了过滤我的下拉列表，我想使用这个脚本：

<script type="text/javascript">
var xhr;
jQuery(function($) {
    $('#filter_building').change(function(){
        var filterBuilding = $('#filter_building').val(); 
        if (xhr && xhr.abort) {
            xhr.abort();xhr=false;
            }
        xhr = jQuery.ajax( {
            url: 'index.php', 
            data: 'option=com_mycomponent', 
            success: function(data){
                jQuery('#filter_building').replaceWith(data);
            }
        });
    });
});
</script>

但是某个地方是错误的，它不起作用。

Answer 1

$('#filter_building').change(function(){

    var buildingId = $(this).val();

    $.ajax({
        url: "index.php",
        type: "post",
        data: {buildingId: buildingId}, 
        success: function(data) {
            $('select#floor-id').html(data); 
           // data = '<option>val1</option><option>val2</option>'
        }
    });
}):

Answer 2

我在index.php中有示例jquery和函数 Jquery和ajax

$('#filter_building').change(function(){
var buildingId =  $('#filter_building').val();
$.ajax({
    url: "index.php",
    type: "post",
    data: {buildingId: buildingId}, 
    success: function(data) {
        if(data != "false")
    {
        $('#Floor').html(data); 
    }
    else{
    alert("No value");}
    }
});
});

并在index.php页面

$buildingId = JRequest::getVar('buildingId');
$db->setQuery("SELECT floor_name, id FROM floors WHERE filter_building='".$_GET['filter_building']."'");
$db->query();
$num_rows = $db->getNumRows();
if($num_rows>0){
while($nt = $db->loadAssoc()){
echo "<option value=$nt['id']>$nt['floor_name']</option>"; 
}
}
else
{
echo "false";
}

Answer 3

<strong>
    <div class="float-right">
        <span>From: </span><input type="date" name="From1" id="From1" />
        <span>To: </span><input type="date" name="To1" id="To1" />
        <input type="submit" value="Get Details" onclick="GetDetailsFromToTransactions()" />
    </div>

    </div>
    <div class="smallsize1 float-right" id="filterdropdown">
        <select id="selectBox" onchange="FilterDate(value);">
            <option value="0" Idselected>Select Filter</option>
            <option value="1">Today</option>
            <option value="-1">Last 1 Month</option>
            <option value="-3">Last 3 Months</option>
            <option value="-6">Last 6 Months</option>
            <option value="-9">Last 9 Months</option>
            <option value="-12">Last 1 Year</option>
            <option value="-24">Last 2 Years</option>
        </select>
    </div>
</strong>

使用jquery.ajax过滤下拉表单

3 个答案: