草庐IT

php - Ajax 操作后刷新模态

coder 2024-04-20 原文

在执行 AJAX 操作后,我想刷新我的模式,但我不知道该怎么做。我在这个问题上花了太多时间。

在页面 ViewCharacter.php 中,您将看到一个包含最新数据的页面,您可以单击铅笔按钮“#ButtonEditCharacterStats”来编辑统计数据,然后它将为您打开一个模式最新数据。当您单击按钮“加 1”按钮 (#StrengthPlusOne) 时,该数字会增加 1,但之后我想关闭模态,再次加载它并显示最新数据。

或者更好的解决方案是保持模态打开并加载模态的内容。我似乎找不到解决方案。

任何进一步改进此脚本的想法将不胜感激。

ViewCharacter.php

<?php
$Character = new Character;
$Character->getSingleCharacter();

$result = $Character->getSingleCharacter();
?>

<h2>Character</h2>

<?php
while ($Character = $result->fetch_object())
{
    ?>
    <h3><?php echo $Character->FirstName ?></h3>
    </br>

    <div class="row">
        <div class="col-xs-6">
            <div class="panel panel-default">
                <div class="panel-heading">
                    Stats
                </div>
                <div class="panel-body"> 


                    <ul class="nav nav-pills" role="tablist">
                        <li role="presentation" class="active">
                            <button id="ButtonEditCharacterStats" style="" data-toggle="modal" data-target="#EditCharacterStats" class="ToolbarButton glyphicon glyphicon-pencil fa-2x"></button>

                            </br></br>

                            <a href="#">Strength <span class="badge"><?php echo $Character->Strength; ?></span><span class="badge"><?php echo $Character->StrengthBonus; ?></span></a></br>
                            <a href="#">Dexterity <span class="badge"><?php echo $Character->Dexterity; ?></span><span class="badge"><?php echo $Character->DexterityBonus; ?></span></a></br>
                            <a href="#">Constitution <span class="badge"><?php echo $Character->Constitution; ?></span><span class="badge"><?php echo $Character->ConstitutionBonus; ?></span></a></br>
                            <a href="#">Intelligence <span class="badge"><?php echo $Character->Intelligence; ?></span><span class="badge"><?php echo $Character->IntelligenceBonus; ?></span></a></br>
                            <a href="#">Wisdom <span class="badge"><?php echo $Character->Wisdom; ?></span><span class="badge"><?php echo $Character->WisdomBonus; ?></span></a></br>
                            <a href="#">Charisma <span class="badge"><?php echo $Character->Charisma; ?></span><span class="badge"><?php echo $Character->CharismaBonus; ?></span></a></br>

                        </li>
                    </ul>                
                </div>
                <?php
            }
            ?>

            <div class="panel-footer">
                Stats
            </div>
        </div>
    </div>
    <div class="col-xs-6">
        <div class="panel panel-default">
            <div class="panel-heading" style="background-color: #d9534f;color:white;">
                Stats
            </div>
            <div class="panel-body">
                <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum tincidunt est vitae ultrices accumsan. Aliquam ornare lacus adipiscing, posuere lectus et, fringilla augue.</p>
            </div>
            <div class="panel-footer">
                Stats
            </div>
        </div>
    </div>

</div>

<script>
    $(document).ready(function () {

        //$("#StrengthPlusOne").click(function()
        $("#StrengthPlusOne").on("click", function ()
        {
            $.ajax({
                method: "POST",
                url: "inc/view/Character/UpdateCharacterStat.php",
                data: {
                    ID: "2",
                    stat: "Strength",
                    Operator: "Increase"

                }
            })
                    .done(function (msg) {
                        alert("Data Saved: " + msg);
                    });
        });
    });

    $("#StrengthMinusOne").click(function () {
        alert("-1");
    });


</script>    

EditCharacterModal.php

<?php
$Character = new Character;
$Character->getSingleCharacter();

$result = $Character->getSingleCharacter();

while ($Character = $result->fetch_object()){?>
</br>

<div id="EditCharacterStats" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="panel-body">
                <div id="EditCharacterStatsContent">
                <h3>Edit Character Stats</h3>
                <ul class="nav nav-pills" role="tablist">
                    <li role="presentation" class="active">
                        </br></br>
                        <a href="#">
                            Strength 
                            <span class="badge"><?php echo $Character->Strength; ?>
                            </span> 
                        <button id="StrengthPlusOne" class="SmallToolbarButton glyphicon glyphicon-plus-sign fa-1x"> 1</button>
                        <button id="StrengthMinusOne" class="SmallToolbarButton glyphicon glyphicon-minus-sign fa-1x"> 1</button>

                        </a>


                        </br>
                        <a href="#">
                            Strength Bonus
                            <span class="badge"><?php echo $Character->StrengthBonus; ?></span>
                        </a></br>
                        <a href="#">
                            Dexterity 
                            <span class="badge"><?php echo $Character->Dexterity; ?></span>
                            <span class="badge"><?php echo $Character->DexterityBonus; ?></span>
                        </a></br>
                        <a href="#">
                            Constitution 
                            <span class="badge"><?php echo $Character->Constitution; ?></span>
                            <span class="badge"><?php echo $Character->ConstitutionBonus; ?></span>
                        </a></br>
                        <a href="#">Intelligence 
                            <span class="badge"><?php echo $Character->Intelligence; ?></span>
                            <span class="badge"><?php echo $Character->IntelligenceBonus; ?></span></a></br>
                        <a href="#">
                            Wisdom 
                            <span class="badge"><?php echo $Character->Wisdom; ?></span>
                            <span class="badge"><?php echo $Character->WisdomBonus; ?></span>
                        </a></br>
                        <a href="#">Charisma 
                            <span class="badge"><?php echo $Character->Charisma; ?></span>
                            <span class="badge"><?php echo $Character->CharismaBonus; ?></span>
                        </a></br>

                    </li>
                </ul>  
                </div>
            </div>
        </div>
    </div>
</div>
<?php
}

UpdateCharacterStat.php

<?php
$Stat = filter_input(INPUT_POST, 'Stat');

include "../../../inc/dbconnect.php";

$sql = "UPDATE TBL_Character SET Strength= Strength + 1 WHERE ID=2";
echo "Strength increase selected!";
if ($connection->query($sql) === TRUE) {

} else {
    echo "Error updating record: " . $connection->error;
}

最佳答案

您应该首先创建一个名为 getCharacterStats.php 的页面。然后使用 javascripts XMLHTTPREQUEST 在数据更新后加载数据。

关于php - Ajax 操作后刷新模态,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/30217797/

有关php - Ajax 操作后刷新模态的更多相关文章

  1. jquery - 我的 jquery AJAX POST 请求无需发送 Authenticity Token (Rails) - 2

    rails中是否有任何规定允许站点的所有AJAXPOST请求在没有authenticity_token的情况下通过?我有一个调用Controller方法的JqueryPOSTajax调用,但我没有在其中放置任何真实性代码,但调用成功。我的ApplicationController确实有'request_forgery_protection'并且我已经改变了config.action_controller.consider_all_requests_local在我的environments/development.rb中为false我还搜索了我的代码以确保我没有重载ajaxSend来发送

  2. ruby - 如何使用 Selenium Webdriver 根据 div 的内容执行操作? - 2

    我有一个使用SeleniumWebdriver和Nokogiri的Ruby应用程序。我想选择一个类,然后对于那个类对应的每个div,我想根据div的内容执行一个Action。例如,我正在解析以下页面:https://www.google.com/webhp?sourceid=chrome-instant&ion=1&espv=2&ie=UTF-8#q=puppies这是一个搜索结果页面,我正在寻找描述中包含“Adoption”一词的第一个结果。因此机器人应该寻找带有className:"result"的div,对于每个检查它的.descriptiondiv是否包含单词“adoption

  3. ruby-on-rails - 如何处理 Grape 中特定操作的过滤器之前? - 2

    我正在我的Rails项目中安装Grape以构建RESTfulAPI。现在一些端点的操作需要身份验证,而另一些则不需要身份验证。例如,我有users端点,看起来像这样:moduleBackendmoduleV1classUsers现在如您所见,除了password/forget之外的所有操作都需要用户登录/验证。创建一个新的端点也没有意义,比如passwords并且只是删除password/forget从逻辑上讲,这个端点应该与用户资源。问题是Grapebefore过滤器没有像except,only这样的选项,我可以在其中说对某些操作应用过滤器。您通常如何干净利落地处理这种情况?

  4. ruby-on-rails - 在 Ruby on Rails 中发送响应之前如何等待多个异步操作完成? - 2

    在我做的一些网络开发中,我有多个操作开始,比如对外部API的GET请求,我希望它们同时开始,因为一个不依赖另一个的结果。我希望事情能够在后台运行。我找到了concurrent-rubylibrary这似乎运作良好。通过将其混合到您创建的类中,该类的方法具有在后台线程上运行的异步版本。这导致我编写如下代码,其中FirstAsyncWorker和SecondAsyncWorker是我编写的类,我在其中混合了Concurrent::Async模块,并编写了一个名为“work”的方法来发送HTTP请求:defindexop1_result=FirstAsyncWorker.new.async.

  5. jquery - 如何将 AJAX 变量从 jQuery 传递到他们的 Controller ? - 2

    我有一个电子邮件表格。但是我正在制作一个测试电子邮件表单,用户可以在其中添加一个唯一的电子邮件,并让电子邮件测试将其发送到该特定电子邮件。为了简单起见,我决定让测试电子邮件通过ajax执行,并将整个内容粘贴到另一个电子邮件表单中。我不知道如何将变量从我的HAML发送到我的Controllernew.html.haml-form_tagadmin_email_blast_pathdoSubject%br=text_field_tag'subject',:class=>"mass_email_subject"%brBody%br=text_area_tag'message','',:nam

  6. ruby-on-rails - 使用 javascript 更改数据方法不会更改 ajax 调用用户的什么方法? - 2

    我遇到了一个非常奇怪的问题,我很难解决。在我看来,我有一个与data-remote="true"和data-method="delete"的链接。当我单击该链接时,我可以看到对我的Rails服务器的DELETE请求。返回的JS代码会更改此链接的属性,其中包括href和data-method。再次单击此链接后,我的服务器收到了对新href的请求,但使用的是旧的data-method,即使我已将其从DELETE到POST(它仍然发送一个DELETE请求)。但是,如果我刷新页面,HTML与"new"HTML相同(随返回的JS发生变化),但它实际上发送了正确的请求类型。这就是这个问题令我困惑的

  7. ruby - 在 Ruby 中是否有一种惯用的方法来操作 2 个数组? - 2

    a=[3,4,7,8,3]b=[5,3,6,8,3]假设数组长度相同,是否有办法使用each或其他一些惯用方法从两个数组的每个元素中获取结果?不使用计数器?例如获取每个元素的乘积:[15,12,42,64,9](0..a.count-1).eachdo|i|太丑了...ruby1.9.3 最佳答案 使用Array.zip怎么样?:>>a=[3,4,7,8,3]=>[3,4,7,8,3]>>b=[5,3,6,8,3]=>[5,3,6,8,3]>>c=[]=>[]>>a.zip(b)do|i,j|c[[3,5],[4,3],[7,6],

  8. ruby-on-rails - 如何让 Rails View 返回其关联的操作名称? - 2

    我有一个非常简单的Controller来管理我的Rails应用程序中的静态页面:classPagesController我怎样才能让View模板返回它自己的名字,这样我就可以做这样的事情:#pricing.html.erb#-->"Pricing"感谢您的帮助。 最佳答案 4.3RoutingParametersTheparamshashwillalwayscontainthe:controllerand:actionkeys,butyoushouldusethemethodscontroller_nameandaction_nam

  9. Postman测试简单操作 - 2

    1、接口请求基本操作1.1例子tips在view的选项可以zoomin调整窗口字帖大小。1、创建一个测试的workspace,并命名为test2、test后面新增一个addrequest3、选择发送GET,URL为一个开源的https://api.apiopen.top/api/sentences获取每日一句4、点击send查看内容Tips:如果提示出现Error:tunnelingsocketcouldnotbeestablished,statusCode=407错误,参照以下解决办法)关于tunnelingsocketcouldnotbeestablished,cause=getaddri

  10. 【Linux操作系统】——网络配置与SSH远程 - 2

    Linux操作系统——网络配置与SSH远程安装完VMware与系统后,需要进行网络配置。第一个目标为进行SSH连接,可以从本机到VMware进行文件传送,首先需要进行网络配置。1.下载远程软件首先需要先下载安装一款远程软件:FinalShell或者xhell7FinalShellxhell7FinalShell下载:Windows下载http://www.hostbuf.com/downloads/finalshell_install.exemacOS下载http://www.hostbuf.com/downloads/finalshell_install.pkg2.配置CentOS网络安装好

随机推荐