weixin_33727510 2017-06-14 15:26 采纳率: 0%
浏览 14

在ajax重新运行php后

I have an select menu that submits without reloading the page as follows:

<select id="option" name="option">
<option value="15">15/option>
<option value"30">30</option>
<option value"90">90</option>
</select>

It will submit to the current page as follows, without reloading the page

<script type="text/javascript">
    $('#option').change(function(){
        var option_val = $(this).val();
        $.ajax({
        type: 'post',
        url: "$_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI'];",
        data: "option="+option_val,
       success: function(data)
        {
           window.alert(data)
        }
        });
    });
</script>

The result of a change in the option menu is an popup window with all the code of the page echoed back.

What i want to do on the page is use the $_POST['option'] that is submitted and recalculate a price for example

<body>
//some code and div's
<?php
if (isset($_POST['option'])) {
    $option = $_POST['option'];
$price= $row_product['price'] + $option;
echo $price;
} ?>
</body>

The are several places where I would like to use the submitted option value

Any help welcome Sorry if it is very obvious

  • 写回答

1条回答 默认 最新

  • weixin_33739541 2017-06-14 15:46
    关注

    The only way is making a PHP page that does the calculation

    HTML/page1.php

    <select id="option" name="option">
    <option value="15">15</option>
    <option value="30">30</option>
    <option value="90">90</option>
</select>
<div id="dynamic">
    <p>DEFAULT CONTENT</p>
</div>

    HTML/page2.php

    $option = 0;
if(isset($_GET["option"])){
    $option = $_GET["option"];
}
//do calculations
echo "<my-html-stuff>lorem ipsum</my-html-stuff>";

    JS

    var dynamic = $("#dynamic");
$('#select').on("change", function() {
   var selected = $(this).val();
   dynamic.load("page2.php?option=" + selected, function() {
       dynamic.html("<p>CONTENT OPTION "+selected+"</p>");
   });
});

    Fiddle ==> https://jsfiddle.net/tonysamperi/4dbwwn3g/

    WITH JSON

    page2.php

    header('Content-Type: application/json');

$option = 0;
if(isset($_GET["option"])){
     $option = $_GET["option"];
}
$response = ["result" => $option];
echo json_encode($response);

    JS

    $('#select').on("change", function() {
   var selected = $(this).val();
   $.get("page2.php?option=" + selected, function(response) {
       //do stuff with data
       console.debug("RESPONSE", response);
   });
});
    评论

报告相同问题？

  • baidu.rar_ajaxhtml运行
    2022-09-21 06:25
    在网页开发中，AJAX（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。这个压缩包包含了一个HTML文件，用于演示如何运用AJAX来实时获取并展示搜索建议。 【描述...
  • php ajax 域名查询_domainsearch毕业设计—（包含完整源码可运行）.rar
    2022-04-23 17:23
    在这个设计中，用户在输入框中输入域名后，通过AJAX发送请求到服务器，获取查询结果，然后动态更新页面显示。这提供了良好的用户体验，因为用户无需等待页面刷新就能看到反馈。 3. JavaScript & ECMAScript：...
  • ajax PHP 大文件上传
    2020-11-06 15:43
    Ajax（Asynchronous JavaScript and XML）是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。通过在后台与服务器交换数据并更新部分网页内容，用户可以无需等待整个页面重新加载就能看到新的内容，...
  • php+ajax实现文章自动保存的方法
    2020-10-24 23:18
    在autosavetime函数内部，通过AJAX发送文章的标题、内容等数据到PHP端，然后重置定时器，让这个过程可以持续运行。 在PHP代码部分，文章首先通过JavaScript获取用户代理字符串（userAgent），并据此判断用户的...
  • crud-php-ajax.zip_ajax php_crud php ajax_php ajax
    2022-09-24 19:15
    1. 创建（Create）：用户填写表单后，前端通过AJAX发送POST请求到PHP脚本，PHP处理插入数据库的逻辑。 2. 读取（Read）：前端可以向PHP发起GET请求，PHP返回数据库中的数据，前端再用这些数据填充表格。 3. 更新...
  • 聊天留言Ajax PHP文本留言本-xingbook.rar
    2024-04-07 07:08
    功能在确认正常工作后才上传。【适用人群】：适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。【附加价值】：项目具有较高的学习借鉴价值，也可直接拿来...
  • ajax实现无刷新分页(php)
    2020-12-17 23:15
    Ajax（Asynchronous JavaScript and XML）技术允许网页在不重新加载整个页面的情况下与服务器交换数据并更新部分网页内容。这种技术大大提升了用户体验，尤其是在处理大量数据分页显示时，如博客、论坛、电商网站等...
  • php ajax数据传输和响应方法
    2020-10-18 04:16
    Ajax（Asynchronous JavaScript and XML）是一种在无需重新加载整个页面的情况下，能更新部分网页的技术。它允许网页实现异步更新，这意味着可以在不中断用户操作的情况下，与服务器交换数据并更新部分网页内容。而...
  • ajax+php打造进度条 readyState各状态
    2020-10-29 06:42
    需要注意的是，在AJAX请求中，PHP脚本运行的效率直接影响到进度条的表现。如果后端处理非常耗时，那么前端进度条的反馈也会相应地缓慢。因此，通常会将耗时的处理过程异步化，比如使用多线程、后台处理等方式来保证...
  • 前端之AJAX全接触
    2022-07-25 22:53
    Autumn_Hibiscus的博客 Ajax不是某种编程语言，是一种在无需重新加载整个网页的情况下能够更新部分网页的技术。改变了Web开发的格局。传统网页（即不使用Ajax技术的网页），想要更新内容或者提交一个表单，就需要重新载入页面。使用了Ajax...
  • 没有解决我的问题, 去提问