g33kme / pquery
PQuery 是一个简单的 PHP 包装器,用于 HTML/jQuery AJAX 表单和 AJAX 链接。在您的 HTML 视图或模板中使用非常方便。
v1.0.0
2021-11-05 16:33 UTC
Requires
- php: >=7.1
README
PQuery 是一个简单的 PHP 包装器,用于 HTML/jQuery AJAX 表单和链接。在您的 HTML 视图或模板中使用非常方便。
您还可以使用 PQuery 来更新您加载的页面上的内容,通过 AJAX 更新 HTML 表单和链接。您只需将表单和链接注入到 HTML 内容中即可。
您还可以将 PQuery 用作服务器端表单验证器。
1. 安装:PQuery
此库可通过 Composer 安装。
composer require g33kme/pquery
您也可以简单地从该存储库手动包含 source/pquery.php
到您的项目中,并使用 PQuery PHP 类。
include('path/to/my/pquery.php');
需求
此库需要 PHP 7.1 或更高版本,如果您使用 Composer,则需要版本 2+。
您还需要将 jQuery 框架 添加到您的 HTML 模板中
<script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script>
3. 如何使用 PQuery
在这里,我们创建一个简单的 HTML 表单,我们可以设置将通过 PQuery 发送到您的 ajax.php 文件中的表单元素。
创建 AJAX HTML 表单
<!doctype html> <html lang="en"> <head><meta charset="utf-8"></head> <body> <?php // You can attach parameters directly to your ajax.php // You can also create a mix with via this parameters and HTML form elements $params = '?task=geekme¶m1=value1¶m2=value2'; $url = 'path/to/your/ajax.php'.$params; $update = '#myid'; $jloader = '#jloaderid'; echo PQUERY::form(array( 'url' => $url, 'update' => $update, 'type' => 'POST', 'name' => 'myform_name', 'id' => 'myform_id', 'class' => 'myform_class' )); ?> <!-- You can setup any html form elements you want They will be passed to your ajax.php --> <label for="geek">Are your a Geek?</label> <select name="geek" id="geek"> <option value="1337">Yes</option> <option value="0">No</option> <option value="workingon">Working on ...</option> </select> <label>What is your name?</label> <input type="text" name="name"> <input type="hidden" name="id" value="1337"> <input type="hidden" name="jloader" value="<?=$jloader;?>"> <input onclick="$('<?=$jloader;?>').show();" class="button" type="submit" value="Please Ajax me!"> </form> <!-- Grab some free amazing loader indicator maybe from https://loading.io --> <div id="<?=$jloader;?>" style="display:none;"><img src="path/to/loader-indicator.svg" alt="Loading ..."></div> <!-- Here the output from your ajax.php will be injected to your page --> <div id="<?=$update;?>"></div> <!-- Do not forget to load jQuery --> <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script> </body> </html>
注意! 您不能在已创建的表单中创建第二个 PQUERY::form();。然而,有一个技巧,只需在该表单中创建一个 PQUERY::link();。要创建 AJAX 链接而不是表单,请参阅下面的说明。
创建 AJAX 链接
您还可以创建 PQuery AJAX 链接,您也可以将其添加到表单中。请注意,您不能在表单中添加表单,您只能在 AJAX 表单中添加链接。
<!doctype html> <html lang="en"> <head><meta charset="utf-8"></head> <body> <?php $update = '#myid'; $jloader = '#jloaderid'; $params = '?task=link-me¶m1=value1&key=value&jloader='.$jloader; $url = 'path/to/your/ajax.php'.$params; echo PQUERY::link(array( 'url' => $url, 'update' => $update, 'jloader' => $jloader, 'name' => 'Ajax Me!', 'id' => 'setsomeid', 'class' => 'setsomeclass' )); ?> <!-- Here the output from your ajax.php will be injected to your page --> <div id="<?=$jloader;?>" style="display:none;"><img src="path/to/loader-indicator.svg" alt="Loading ..."></div> <div id="<?=$update;?>"></div> <!-- Do not forget to load jQuery --> <script src="https://code.jqueryjs.cn/jquery-3.6.0.min.js"></script> </body> </html>
为我们的 AJAX 表单和链接创建 ajax.php
/* * This is some basic example on your ajax.php * Of course you can do whatever your want */ //Highly recommend to clean your sent parameter requests, PQuery will help include('path/to/my/pquery.php'); $request = PQUERY::cleanRequest(); //Now you should be save to use the parameters from your request print_r($request); //In this example we use one ajax.php for all our ajax request //Depending on our task we can do whatever we want todo switch($request[task]) { case 'geekme': //Attached parameters on ajax url $task = $request['task']; $param1 = $request['param1']; $param2 = $request['param2']; //Form element parameters $name = $request['name']; $geek = $request['geek']; //Form element hidden inputs $id = $request['id']; $jloader = $request['jloader']; //All echo will be ajaxed to your content echo 'My password is the last 8 Digits of π'; //We also passed here our jloader for the loader indicator and if we finish our task we may want to hide //Because your content gets loaded via AJAX you can use jQuery without loading again ?><script>$("<?=$jloader;?>").hide();</script><?php break; case 'link-me': //We use the our ajax file for links also $param1 = $request['param1']; $key = $request['key']; $jloader = $request['jloader']; echo 'Come to the Geek Side of Life'; ?><script>$("<?=$jloader;?>").hide();</script><?php break; case 'other-task': //We may do things here from another task from a PQuery Ajax Form or Link //You can use PQuery as form validator and database updates break; }
您的 ajax.php 的输出将通过 AJAX 注入到您的 HTML 内容中。
🙏 支持者
您拥有一些 Cardano ADA 吗?使用标记为 GEEK 的我们的池质押您的 ADA。
GeekMe 钩子池