如何在不刷新页面的情况下从其他菜单中获取值?

时间:2017-09-02 07:21:16

标签: javascript php jquery html bootstrap-4

单击表单上的单选按钮时,会显示一个弹出菜单。我使用bootstrap模块弹出新菜单。

当我从弹出菜单中选择该选项时,表单将被重置。先前输入的表单值将丢失。

这是我的菜单和模块的代码。 托管链接也可在此处获取:www.dbghale.ml

RewriteCond %{QUERY_STRING} page=([0-9]+)
RewriteRule ^index.html /page%1.html? [L,R=301]

当我从弹出菜单中选择选项时,我想要不重置的值。

screen shot of the page is here.

2 个答案:

答案 0 :(得分:1)

你可以使用jquery的ajax。你可以从其他文件php调用文件的某些html标签值。

$(document).ready(function(){
        $.ajax({
            url:'ekstrnal_file.php',
            success:function(e){
            $("select").html(e);
            }
        })
    });

答案 1 :(得分:1)

您似乎是从POST或Get发回整个页面,因此再次从头开始页面。

在PHP中,测试您是仅请求或设置值。您不需要发回html页面,它已在浏览器中准备就绪。 如果您要从页面中的PHP请求数据,请在代码顶部进行测试,然后在不刷新页面的情况下返回。

  <?php
    if(isset($_POST[''submit_btn''))
    {
        echo CallSomeFunctionWithThePostRequest($_POST['submit_btn']);
         return; // don't continuing loading the default page.
    }
    ?>
    < !DOCTYPE html>
    < html lang="en">
    < head>
      ... rest of the page. ....
    < input id="aFormInput" onclick="jsMakeAjaxCallToPage(SomeRequstData);" .  >
    <div id="putResponceHere" ></div>
    < script>
     function jsMakeAjaxCallToPage(SomeRequstData)
      {
     // use an async call to get/set the data.   
     xhttp = new XMLHttpRequest();
     xhttp.onreadystatechange = function() {
     if( xhttp.readyState == 4 && xhttp.status ==200)
     {
       // Your php response is in xhttp.responseText;      
        document.getElementById("putResponceHere").innerHTML= http.responseText;
     } };
     xhttp.open("POST", "",true); //PORT request to the same url as the page.
     xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
     xhttp.send("?request="+SomeRequestData);
     return(false); // don't do the default button action.
    }
    </script>
这是快速粗略的给你的想法。