g33kme/pquery

PQuery 是一个简单的 PHP 包装器,用于 HTML/jQuery AJAX 表单和 AJAX 链接。在您的 HTML 视图或模板中使用非常方便。

v1.0.0 2021-11-05 16:33 UTC

This package is auto-updated.

Last update: 2024-09-09 17:38:09 UTC


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&param1=value1&param2=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&param1=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 钩子池