dtpyvb1873 2016-11-22 22:50
浏览 29

使用ajax过滤

I'm a FileMaker programmer trying to port a database across to the web using PHP their API. I've got my php page working, retrieving and displaying the correct data from my search, however I would like to filter the results on my page every time my user picks a checkbox (Apple, Microsoft etc) without hitting the submit button. I know I need to use ajax to perform this, however can I inject the ajax into this page below or am I now going to have to break down the page into various smaller files, php and js files?

Most of the samples I have found are json based, which do filtering client side. FileMaker returns an odd type array with PHP which requires further processing to get into json format. I'm ideally looking for a way to just post back the form everytime my user click on a checkbox, which I think maybe simpler if possible?

<?php require_once('../db.php'); 

if(isset($_REQUEST['search'][0]))
{

$find = $fm->newCompoundFindCommand('Data');
$request1 = $fm->newFindRequest('Data');
if(isset($_REQUEST['search'][1])){ $request2 = $fm->newFindRequest('Data'); }
if(isset($_REQUEST['search'][2])){ $request3 = $fm->newFindRequest('Data'); }

$request1->addFindCriterion('Company',$_REQUEST['search'][0]);
if(isset($_REQUEST['search'][1])){ $request2->addFindCriterion('Company',$_REQUEST['search'][1]); }
if(isset($_REQUEST['search'][2])){ $request3->addFindCriterion('Company',$_REQUEST['search'][2]); }

$find->add(1,$request1);
if(isset($_REQUEST['search'][1])){ $find->add(2,$request2); }
if(isset($_REQUEST['search'][2])){ $find->add(3,$request3); }

$result = $find->execute(); 

} else {

$request = $fm->newFindCommand('Data');

$request->addFindCriterion('Company','*');
$result = $request->execute();

}


?>
<!DOCTYPE html>
<html lang="en">
<head>
<title></title>
</head>
<body>
<div id="filters">
    <form action="data_table.php" method="post">
        <input class="category" id="check1" name="search[]" type="checkbox" value="Apple"> 
        <label for="check1">Apple</label> 
        <input class="category" id="check2" name="search[]" type="checkbox" value="Google"> 
        <label for="check2">Google</label> 
        <input class="category" id="check3" name="search[]" type="checkbox" value="Microsoft"> 
        <label for="check3">Microsoft</label> <input type="submit" value="Submit">
    </form>
</div>
<table border="0" class="table table-striped" width="100%">
    <thead>
        <tr>
            <th>Company</th>
        </tr>
    </thead><?php if(!FileMaker::isError($result)) {?>
    <tbody class="searchable">
        <?php foreach($result->getRecords() as $row){ ?>
        <tr>
            <td><?php echo $row->getField('Company'); ?></td>
        </tr><?php } ?>
    </tbody><?php } ?>
</table><!-- end row -->
</body>
</html>
  • 写回答

1条回答 默认 最新

  • doufengsui7449 2016-11-22 23:02
    关注

    Let me try and break down you code part.

    $request->addFindCriterion('Company','*');
    $result = $request->execute();
    

    At this point you have the results after applying the query. Just encode it in json like

    echo json_encode($result);
    

    this is your api endpoints. You will be making all ajax queries over here. Move all html content to a separate file.

    Now this part of code

    <table border="0" class="table table-striped" width="100%">
        <thead>
            <tr>
                <th>Company</th>
            </tr>
        </thead><?php if(!FileMaker::isError($result)) {?>
        <tbody class="searchable">
            <?php foreach($result->getRecords() as $row){ ?>
            <tr>
                <td><?php echo $row->getField('Company'); ?></td>
            </tr><?php } ?>
        </tbody><?php } ?>
    </table><!-- end row -->
    

    becomes obsolete as you might have guessed for obvious reasons. There is no $result in this file. It is just a static html. You need to make ajax request in this file to the api point we just used above. You will get the response in json. Populate it into a table. Similarly if the users has other search parameters, make ajax request with proper search and repopulate the table in javascript.

    Which part is simpler ?

    That purely depends on the kind of application you are building. If it is somewhat along the lines of Single Page app i would suggest javascript filtering else go for filter in api.

    Remember javascript does not have proper sql database and they are implementations of localstorage so the execution might be long, but that is a tradeoff people make for persistant apps.

    评论

报告相同问题?

悬赏问题

  • ¥15 Vue3 大型图片数据拖动排序
  • ¥15 划分vlan后不通了
  • ¥15 GDI处理通道视频时总是带有白色锯齿
  • ¥20 用雷电模拟器安装百达屋apk一直闪退
  • ¥15 算能科技20240506咨询(拒绝大模型回答)
  • ¥15 自适应 AR 模型 参数估计Matlab程序
  • ¥100 角动量包络面如何用MATLAB绘制
  • ¥15 merge函数占用内存过大
  • ¥15 使用EMD去噪处理RML2016数据集时候的原理
  • ¥15 神经网络预测均方误差很小 但是图像上看着差别太大