2016-04-23 18 views
0

私はプログラミングに問題があります。私はAJAXにとって非常に新しく、自分が何をしているのか分からないので、うまく動作しません。どんな助けも高く評価されます。私はページ上に複数のフォームがあり、フォームを分けると、Ajaxとphpの間の通信はうまく動作します。しかし、私はすべてを一緒に置くと、それは動作を停止します。私はそれがコミュニケーションの問題か、いくつかの矛盾するスクリプトか、まあまあの悪いコーディングだと信じています。ここでAjax-PhP通信

は、PHPのコードです:ここで

@session_start(); 
if(isset($_SESSION["username"])){ 
    header("location: home.php"); 
exit(); 
}else{ 
    $usertitle = $_POST['ut']; 
    $userfname = $_POST['uf']; 
    $userlname = $_POST['ul']; 
    $useremail = $_POST['ue']; 
    $userloc = $_POST['uloc']; 
    $user_est_typ = $_POST['utp']; 
    $userfname = preg_replace("/[^A-Za-z0-9?![:space:]]/","",$userfname); 
    $userlname = preg_replace("/[^A-Za-z0-9?![:space:]]/","",$userlname); 
    if($usertitle == "Title...."){ 
     echo '<font color="red">Error: Please select a title.'; 
     exit(); 
    }else if($userfname == NULL){ 
     exit('<font color="red">Error: You need a first name to proceed. </font>'); 
    }else if(strlen($userfname) <= 2){ 
     exit('<font color="red">Error: First name should be three (3) or more letters.</font>'); 
    } else if($userlname == ""){ 
     exit('<font color="red">Error: Giving a Surname would be nice.</font>'); 
    }else if(strlen($userlname) <= 2){ 
     exit('<font color="red">Error: Surname should be three (3) or more Letters.</font>'); 
    }else if(!strpos($useremail, "@") || !strpos($useremail, "." || !filter_var($useremail, FILTER_VALIDATE_EMAIL) === true)){ 
     exit('<font color="red">Email Address not valid</font>'); 
    }else if($user_est_typ == "Select..."){ 
     exit('<font color="red">Error: You must select an estimate type to proceed.</font>'); 
    }else if($userloc == ""){ 
     exit('<font color="red">Error: A location would be required so as to get the radiation data for the estimates</font>'); 
    }else { 
     include("../../scripts/dbconect.php"); 
     $queryuseremail = mysql_query("SELECT id FROM userdata WHERE userEmail='$useremail' LIMIT 1"); 
     $useremail_check = mysql_num_rows($queryuseremail); 
     if ($useremail_check > 0){ 
     echo "The email address ".$useremail." is already registered in ur database"; 
     exit(); 
     } 
     // More Validation and mysql insert 

     exit('<font color="red">signup_success</font>'); 
    } 
} 

は私のAJAXコードです:

function _(x){ 
     return document.getElementById(x); 
    } 

    function show(id){ 
     var divelement = _(id); 
     if(divelement.style.display == 'none') 
      divelement.style.display = 'block'; 
      else 
    divelement.style.display == 'none'; 
    } 


    function hide(id){ 
     var divelement = _(id); 
     if(divelement.style.display == 'block') 
     divelement.style.display = 'none'; 
     else 
     divelement.style.display == 'block'; 
    } 

function emptyElement(id){ 
    _(id).innerHTML = ""; 
} 

function estimatetypeimg(){ 
     var estType = _('estimatetype').value; 
     if (estType == 'solarpv'){ 
      show('estimate_pv'); 
      hide('estimate_thermal'); 
     } 
      else if(estType == 'solarthermal'){ 
      hide('estimate_pv'); 
      show('estimate_thermal'); 
     } 
     else{ 
     hide('estimate_pv'); 
     hide('estimate_thermal'); 
     } 
    } 

    function newUsers() { 
    var title = _("salutation").value; 
    var fname = _("fname").value; 
    var lname = _("lname").value; 
    var email = _("email").value; 
    var loc = _("location").value; 
    var tp = _("estimatetype").value; 
    var url = "ajax.php"; 
    var vars = "ut="+title+"uf="+fname+"&ul="+lname+"&ue="+email+"&uloc="+loc+"&utp="+tp; 

    var xhttp = new XMLHttpRequest(); 
    xhttp.onreadystatechange = function() { 
    if (xhttp.readyState == 4 && xhttp.status == 200) { 
     _("statuscheck").innerHTML = xhttp.responseText; 
     } 
    }; 
    xhttp.open("POST", url, true); 
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); 
    xhttp.send(vars); 
    } 

そして、ここでは私のhtmlコードです:

<div id="startbuts" style="display:none"> 
    <form class="pure-form" name="startbutsform" id="startbutsform" onsubmit="return false;"> 
     <button type="submit" id="newusersbtn" onclick="show('newusers'); hide('existingusers'); hide('existingusersbtn');"class="pure-button pure-button-primary">New Estimate</button> 
     <button type="submit" id="existingusersbtn" onclick="show('existingusers'); hide('newusers'); hide('newusersbtn');" class="button-secondary pure-button">Load Previous Estimate</button> 
    </form> 

    <div id="existingusers" style="display:none"> 
     <form class="pure-form" name="signupex" id="signupex" onsubmit="return false;"> 
      <fieldset> 
       <legend>Existing users: login with your email and Data ID.</legend> 
        <input type="email" id="dataemail" placeholder="Email" > 
         <input type="text" id="dataid" placeholder="DataId"><br/> 
          <button id="signupexbtn" type="submit" onclick="signinold()" class="pure-button pure-button-primary">Sign in</button> 
       </fieldset> 
       </form> 
       </div> 
       <div id="newusers" style="display:none"> 
      <form class="pure-form" name="signupnew" id="signupnew" onsubmit="return false;"> 
      <fieldset> 
        <legend>New users start here.</legend> 
         <div class="pure-control-group"> 
         <label for="salutation">Title: </label> 
         <select id="salutation" name="salutation"> 
         <option>Title....</option> 
         <option>Prof. Dr.</option> 
         <option>Prof.</option> 
         <option>Dr.</option> 
         <option>Mr.</option> 
         <option>Mrs.</option> 
         <option>Miss.</option> 
       </select> 
      </div> 
      <div class="pure-control-group"> 
     <label for="fname">First name:</label> 
     <input id="fname" name="fname" type="text" placeholder="First Name"> 
    </div> 
    <div class="pure-control-group"> 
     <label for="lname">Last name:</label> 
     <input id="lname" name="lname" onfocus="emptyElement('errorcheck')" type="text" placeholder="Last Name"> 
    </div> 

    <div class="pure-control-group"> 
     <label for="email">Email Address:</label> 
     <input id="email" name="email" type="email" onfocus="emptyElement('errorcheck')" placeholder="Email Address"> 
    </div> 

    <div class="pure-control-group"> 
     <label for="location">Project Location: </label> 
     <input id="location" name="location" type="text" onfocus="emptyElement('errorcheck')" placeholder="Enter City ex Buea..."> 
    </div> 

    <div class="pure-control-group"> 
     <label for="estimatetype">Type of Estimate: </label> 

     <select id="estimatetype" name="estimatetype" onchange="estimatetypeimg()"> 
      <option value="Select">Select...</option> 
      <option value="solarpv">Solar PV</option> 
      <option value="solarthermal">Solar Thermal</option> 
     </select> 
    </div> 

    <div id="estimate_pv" style="display:none" > 
     <img id="solarpvimg" src="images/solarpv.png" width="250" height="109" alt="Solar PV" /> 
    </div> 
    <div id="estimate_thermal" style="display:none"> 
     <img id="solarthermalimg" src="images/solarthermal.png" width="250" height="109" alt="Solar PV" /> 
    </div> 
    <hr/> 
     <button id="signupnewbtn" type="button" class="pure-button pure-button-primary" onclick="newUsers()" >Start Calculator</button> 
     <button onclick="emptyElement('errorcheck'); hide('estimate_pv'); hide(estimate_thermal);" class="pure-button pure-button-primary" type="reset">Reset </button> 
     </fieldset> 
     </form> 
     </div> 
     </div> 
+1

代わりに1つのフォームを使用するのはなぜですか? –

+1

バディ、あなたのコードの全体シーケンスを理解するのはあまりにも面倒ですが、ajaxでフォームを送信するためにjqueryとmalsup jqueryプラグインを使用することをお勧めします。また、使用しているPHPスクリプトを改善し、最小化して読みやすくすることができます –

+0

理由のいくつかは、PHPスクリプトからの応答に基づいて表示される予定です。だから私はすべてのために1つのフォームを使用する場合、どのようにそのようになるのか分からない。しかし、それを試してみる – Bob

答えて

0

は、特にあなたのデビッドLavieriに感謝し、 Sher Kahn。あなたの応答は私の考えを得て、私は最終的に私が私のPhPスクリプトから何の応答も得ていない理由を考え出しました。 Khanも言及しているように、私はちょうど趣味のコーダーであり、あなたは絶対に正しいです。私のコードはあまりきれいではありません。私はJSLintのコードをきれいにし、私はあまりにも多くの悪いコーディング習慣があることに気付きました。 :)。 malsupのクエリプラグインで私に頭を下げてくれてありがとう。彼らは非常に便利で多くを助けるでしょう。

最後に私が持っていた問題に。実際の問題はphpファイルへのリンクでした。 urlはあまり定義されていないため、ajaxとphpファイルの間の通信が不可能になっていました。私はDreamweaverを使用し、私はファイルへのリンクを私に与えたブラウズツールを使用したが、私のjavascriptが外部だったので、リンクはJavascriptファイルにのみ関連し、メインのHTMLファイルではなかった。私は私のデータVARSをダブルチェックするときも、私は

var url = "ajax.php";// i changed the path file to scripts/ajax.php and it worked like magic. 
var vars = "ut="+title+"uf="+fname+"&ul="+lname+"&ue="+email+"&uloc="+loc+"&utp="+tp;// before 
var vars = "ut="+title+"&uf="+fname+"&ul="+lname+"&ue="+email+"&uloc="+loc+"&utp="+tp;// After 

「UF」の前に文字列で私の第二の可変のために、これは他の誰かに助けになることを願ってを逃し、「&」。

DavidとKhanに感謝します。