2016-07-18 2 views
0

현재 문제가 발생했으며 올바른 방법으로 문제를 해결하고 싶습니다. 2 개의 언어. 그것에 따라 다른 것. 적어도 내 경우에는.자바 스크립트를 사용하여 PHP로 가져 오기

PHP : 데이터베이스 액세스, 삽입, 데이터 선택.

자바 스크립트 : 내 페이지를 새로 고침하지 않아도 유용한 호출 이벤트.

음 .. 아약스를 사용했지만 올바른 방법은 상당히 복잡해 보입니다.

예를 들어 보겠습니다. 내가 다음과 같은 PHP 함수를 가지고 있다고 가정 해 봅시다.

function createDiv($value1, $value2, $value3){ 
    echo " 
     <div> 
     <h3>."$value1".</h3> 
     <h3>."$value2".</h3> 
     <h3>".$value3."</h3> 
     </div> 
    "; 
} 

내 HTML 내에서이 함수를 이와 같이 호출합니다.

<?php 

    $values = $db->getValues(); //(Let's say that i'm getting an array) 
    createDiv($values[0],$values[1],$values[2]); 

?> 

이제 내가 새로 고침 할 필요없이 미리 정의 된 목록 항목을 클릭 할 때이 div에 내부 데이터를 추가 할 ... 한 단계 더 갈 수 있습니다.

<ul class="social-buttons" id="demo2"> 
    <li> 
    <a onclick="letterSearch(this);" >A</a> 
    </li> 
    <li> 
    <a onclick="letterSearch(this);" >B</a> 
    </li> 
    <li> 
    <a onclick="letterSearch(this);" >C</a> 
    </li> 
<li> 

그래서, 지금은 자바 스크립트 & 아약스를 사용하고 있습니다.

function letterSearch(element){ 
    //With this ajax i'm calling a similar function to $db->getValues(); 
    //That i called before to get my values 
    //With the difference of the searching parameter 
    $.ajax ({ 
     type:"POST", 
     url: "ajaxAccess.php", 
     dataType:"json", 
     data: {tag: 'valuesWithSearch', arguments: element.innerHTML}, 
     success: function(result) { 
     var jsonValues = JSON.parse(result); 
     //After this point i have stored in jsonValues the expected array list that i wanted to get. 
     //Now what?? 
     } 
    }); 
} 

그래서 ..

내 첫 번째 질문은 : 어떻게 DIV의 아래쪽에 난 그냥 아약스에서 가져온 데이터를 넣을 수 있습니다?

jQuery.append()? 

그리고 마지막 아니지만 적어도 ..인가 나의 접근 방식은 overcomplicated? 다른 방법이 있습니까? PHP의 첫 번째 비트는 아약스를 통해 호출하는지 경우 HTML에서 PHP에서

+0

잘못된. 당신은 HTML을 만들고 출력하고 있습니다. jquery는 json을 기다리고 있습니다. html은 결코 유효하지 않으며 json/javascript가 유효하지 않으므로 json.parse가 완전히 실패합니다. –

+0

이것은 내가 아약스와 통화하는 것이다.'$ arg = $ _POST [ 'arguments']; echo json_encode ($ db-> valuesWithSearch ($ arg)); ' 및 JSON.parse가 정상적으로 작동합니다. –

+1

'jsonValues'에 추가 할 HTML 구조를 만들 수 있습니다. 네,'$ ('div'). append (variable)'를 사용하여 DOM에 요소를 추가 할 수 있습니다. 나는 당신이'onclick' 속성을 없애고 적절한 이벤트 핸들러를 사용하도록 제안 할 것입니다. ($ ('li'), on ('click'), function() {}') – empiric

답변

0

<?php 
    echo json_encode(["values"=>$db->getValues()); //Let's say this is an array 
?> 

JAVASCRIPT/JQuery와 IN
<ul class="social-buttons" id="demo2"> 
    <li> 
    <a class="letter-search" >A</a> 
    </li> 
    <li> 
    <a class="letter-search" >B</a> 
    </li> 
    <li> 
    <a class="letter-search" >C</a> 
    </li> 
<li> 

은, 그것은 명백한입니다

$(".letter-search").click(function(e){ 
     e.preventDefault();//Prevent default link action 
     letterSearch($(this)); 
    }) 



    function letterSearch(element){ 
     $.ajax ({ 
     type:"POST", 
     url: "ajaxAccess.php", 
     dataType:"json", 
     data: {tag: 'valuesWithSearch', arguments: element.text()}, 
     success: function(result) { 
      var response = JSON.parse(result); 
     //You now have a valid JSON response 
      //Append if needed, or loop through and process before appending 
      element.append(response.values) 
     } 
     }); 
    } 
관련 문제