2012-10-11 3 views
1

저는 jquery 전문가가 아니며 지난 6 시간 동안이 작업을 수행하려고했습니다.Jquery/Ajax 사용 및 div 레이어에 POST 응답 텍스트 쓰기

php 페이지에서 html 응답을 받으려면 라디오 버튼 그룹 2 개와 체크 박스 배열 1 개를 아약스를 통해 보내야합니다.

양식/버튼을 추가하고 실제로 양식 데이터를 게시하여 처리 PHP 페이지가 올바르게 작동하는지 확인했지만 실제로 처리하고 응답 div에 저장하려고합니다.

제공할만한 도움에 감사드립니다.

html로는 :

<div class="formtaglong"> 
      <input type="radio" value="both" name="buildings" class="small_radio" checked > <span class="checkboxText">Both</span> 
      <input type="radio" value="thunder" name="buildings" class="small_radio" > <span class="checkboxText">Thunderhawk</span> 
      <input type="radio" value="center" name="buildings" class="small_radio" > <span class="checkboxText">Center Drive</span> 
      </div> 

<div class="formtaglong" id="checkall"> 
       <input type="checkbox" value="All" id="sa" name="sa" class="small_radio" > <span class="checkboxText">All</span> 
      <?php 
      while($row = mysql_fetch_array($query)){ 
       echo '<input type="checkbox" value="'.$row['operator'].'" name="users[]" class="small_radio"> <span class="checkboxText">' .$row['operator'] . '</span> '; 
      } 
      ?> 
      </div> 
<div class="formtaglong"> 
      <input type="radio" id="alltime" value="alltime" name="daterange" class="small_radio" checked ><span class="checkboxText">All</span> 
      <input type="radio" id="today" value="today" name="daterange" class="small_radio" > <span class="checkboxText">Today</span> 
      <input type="radio" id="yesterday" value="yesterday" name="daterange" class="small_radio" > <span class="checkboxText">Yesterday</span> 
      <input type="radio" id="threedays" value="threedays" name="daterange" class="small_radio" > <span class="checkboxText">3 Days</span> 
      <input type="radio" id="thisweek" value="thisweek" name="daterange" class="small_radio" > <span class="checkboxText">This Week</span> 
      <input type="radio" id="thismonth" value="thismonth" name="daterange" class="small_radio" > <span class="checkboxText">This Month</span> 
      <input type="Submit" name="print" id="print" value="Submit" class="button"> 
      </div> 

<div id="results" class="shadeGood" style="max-height:620px; width:778px; overflow:auto; float:left;"> 
<!-- I SHOULD HOLD RESPONSE DATA --> 
      </div> 

이것은 내가 가지고있는 JQuery와 함수이다 지금까지 나는 현재 모든 입력 DIV 레이어는 주요 사업부의 ID 번호에 중첩되어 나는 '주의해야한다

<script> 
        $(document).ready(function(){ 
        $("#main").click(function() { 

        //check radio buildings for selected value 
        var radBuild = $('input:radio[name=buildings]:checked').val(); 

        //check radio daterange for selected value 
        var radDate = $('input:radio[name=daterange]:checked').val(); 

        //create array for multiple possibilites from checkbox users 
        var chkUsers = []; 
        //loop through checkboxes appending values to array 
        $('#checkall :checked').each(function() { 
         chkUsers.push($(this).val()); 
        }); 

        //send the request 
        $.ajax({ 
         url: "/pick-print-results.php", 
         type: "post", 
         data: "buildings=" + radBuild + "&daterange=" + radDate + "&users[]=" + chkUsers, 
         // callback for success 
         success: function(data){ 
         $("results").html(data); 
         } //ends sucess callback function 
        }); //ends .ajax function 
       }); //end #checkall.click function 
       }); // ends ready function 
        </script> 

테스트를 위해 클릭 기능 만 사용하십시오.

편집 : 요청에 의해 PHP 처리 파일 추가 : ... 참고 ...이 웹 페이지가 네트워크에서 내부적으로 만 사용되기 때문에 위생 결과가 좋지 않았습니다.

<?php 
//Break up Refer on forward slash/
$refer =explode('/',$_SERVER['HTTP_REFERER']); 

//IF Request Page not print-picks.php page then bounce them there... 
if (end($refer)!='print-picks.php') { 
     $host = $_SERVER['HTTP_HOST']; 
     $uri = rtrim(dirname($_SERVER['PHP_SELF']), '/\\'); 
     $extra = 'print-picks.php'; 
     header("Location: http://$host$uri/$extra"); 
     exit(); 
} 
include 'connect_to_db.php'; 
require_once ('doctype.php'); 

if(isset($_POST['daterange'])){ $daterange = $_POST['daterange']; }else{$daternage='';} 
if(isset($_POST['users'])) { $users=$_POST['users']; }else{ $users='';} 
if(isset($_POST['buildings'])){ $buildings=$_POST['buildings']; }else{$buildings='';} 

//Build Daterange AND statment for query 
switch ($daterange) { 
    case "alltime": 
    $query_chunk_2=''; 
    break; 
    case "today": 
    $query_chunk_2= 'AND pi.date_requested >= \'' . date('Y-m-d') . '\''; 
    break; 
    case "yesterday": 
    $query_chunk_2='AND pi.date_requested >= \'' . date('Y-m-d',strtotime('-1 days')) . '\''; 
    break; 
    case "threedays": 
    $query_chunk_2='AND pi.date_requested >= \'' . date('Y-m-d',strtotime('-3 days')) . '\''; 
    break; 
    case "thisweek": 
    $query_chunk_2='AND pi.date_requested >= \'' . date('Y-m-d',strtotime('-7 days')) . '\''; 
    break; 
    case "thismonth": 
    $query_chunk_2='AND pi.date_requested >= \'' . date('Y-m-d',strtotime('-30 days')) . '\''; 
    break; 
    default: 
    $query_date=''; 
} 

//Build Building AND Statment for query 
switch ($buildings) { 
    case "both": 
    $query_chunk_3=''; 
    break; 
    case "center": 
    $query_chunk_3='AND l.building LIKE \'%Center%\''; 
    break; 
    case "thunder": 
    $query_chunk_3='AND l.building LIKE \'%Thunder%\''; 
    break; 
    default: 
    $query_chunk_3=''; 
} 

//check if users is array 
if(is_array($users)) { 
//Deal With User Array 
//IF ALL IS SET..... GET ALL USERS IGNORE OTHER SELECTIONS 
if($_POST['users'][0]=='All') { 
    $query_chunk_4="AND o.operator NOT LIKE ' '"; 
} else { 
    //ELSE WE LOOP THROUGH EACH VALUE AND BUILD THE QUERY STATEMENT 

    //Chunk 4 segment 1 
    $query_chunk_4 ="AND o.operator IN("; 

    //Get Total Array Values To Properly Add Commas to the String 
    $i=0; // zero start value counter 
    $ar_count=count($_POST['users']); //total elments in array 
     foreach($_POST['users'] as $k=>$c) 
     { 
      $query_chunk_4.="'".$c."'"; 
      if($i!=$ar_count && $i!=($ar_count-1)){ 
       $query_chunk_4.=","; 
      } 
      $i++; 
     } 
     //Chunk 4 last segment 
     $query_chunk_4 .=")"; 
} 
}else { //USERS IS NOT AN ARRAY 
$query_chunk_4="AND o.operator NOT LIKE ' '"; 
} 

//STATIC BEGINING OF QUERY 
$query_chunk_1="SELECT pi . * , p.part_number, o.description, l.location, r.received_date 
FROM picks AS pi 
INNER JOIN parts AS p ON p.part_id = pi.part_id 
INNER JOIN operators AS o ON o.operator_id = pi.operator_id 
INNER JOIN locations AS l ON l.location_id = pi.location_id 
INNER JOIN received AS r ON r.received_id = pi.received_id 
WHERE pi.action_id = '11'"; 

//STATIC END OF QUERY 
$query_chunk_last="ORDER BY pi.date_requested ASC"; 

//MERGE QUERY 
$big_chunk_sql=$query_chunk_1 . ' ' . $query_chunk_2 . ' ' . $query_chunk_3 . ' ' . $query_chunk_4 . ' ' . $query_chunk_last; 
$big_chunk_query=mysql_query($big_chunk_sql) or die(mysql_error()); 
//echo "<br> Big Chunk = ".$big_chunk_sql; 

     $i=''; 
     echo '<table border="1px" style="width: 761px;" cellspadding="0" cellspacing="0">'; 
     while($data=mysql_fetch_array($big_chunk_query)) { 
      if ($i%2 !=0) 
      $rowColor = 'tr1center'; 
       else 
      $rowColor = 'tr2center'; 
       $pendingdate= trim($data['received_date']); 
       $newpendingdate = date('m-d-Y',strtotime($pendingdate)); 
       echo '<tr class="'.$rowColor.'"><td>'.$data['part_number'] . '</td><td>'.date("m-j-y, g:i a", strtotime($data['date_requested'])) .'</td><td>' 
       .$data['description'].'</td><td>'. $data['qty_requested'] . '</td><td>'. $data['location'].'</td><td>'. $newpendingdate . '</td><td> 
       <a href="picking.php?radiopart='.urlencode($data['org_transaction_id']) .'">Mark Picked</a></td></tr>'; 
       if($data['notes_to_picker']!='') { 
       echo '<tr class="'.$rowColor.'" align="center"><td colspan="2">&nbsp;</td><td align="right"><b>notes:</b></td><td colspan="4">' . $data['notes_to_picker'].'</td></tr>'; 
       } 
       $i++; 
      } 
      echo '</table></div>'; 
?> 

편집 # 2

나는 내 성공 함수에 경고 (데이터)를 첨가하고, 나는 "m 유효한 결과 모양을 다시 받고, 그것은 그러나 결과 div 레이어에 기록되지 않는이 시간에 나타납니다. 여기 은 당신이 모든 (HTML) 폼 안에 필요를 넣어 시도하고 단지 $ ('양식'으로 모두를 보낼 수, 음 ..

<table border="1px" style="width: 761px;" cellspadding="0" cellspacing="0"><tr class="tr2center"><td>AS001-70S</td><td>10-9-12, 9:42 am</td><td>Don Ford </td><td>500</td><td>LOAD</td><td>09-28-2010</td><td> 

       <a href="picking.php?radiopart=1005">Mark Picked</a></td></tr><tr class="tr1center"><td>H-016-V75</td><td>10-9-12, 11:28 am</td><td>Don Ford </td><td>80</td><td>LOAD</td><td>09-05-2012</td><td> 

       <a href="picking.php?radiopart=4503">Mark Picked</a></td></tr></table> 
+0

여기에 붙여 넣기 php 파일 – Dgo

+1

당신이 받고있는/얻고있는 응답은 무엇입니까? –

+0

덕분에 PHP 파일이 게시되었으므로 되돌아 갈 것으로 예상됩니다. – nodsdorf

답변

0

내가 경고에서보고 있어요 결과의 팝업입니다) .serialize()

성공 방법 consol e.log (데이터) 또는 경고 (데이터)는

사용 방금 JSON 개체를 다시 보내이 경우 값의 단지 값 또는 배열을 검색하려는 경우가 달려

을 받고있는 것을 볼 수 있습니다.

브라우저에서 Java 콘솔을 열어 오류가 발생하는지 확인하십시오. 더 쉬울거야. 당신의 아약스 방법에

및 사용 데이터 : { "postvar": $ ('일부') 발(), "기타". '발'}, 그것은 신속한 답변했다

)

+0

오류가 보이지 않습니다 .. [09 : 11 : 50.004] http : //localhost/inventory/print-picks.php [HTTP/1.1 200 HTTP http : //localhost/inventory/pick-print-results.php [09 : 11 : 52.342] POST http : // localhost/inventory/pick-print-results.php [HTTP/1.1 200 OK 7ms] - [09 : 12 : 01.237] POST http : //localhost/inventory/pick-print-results.php [HTTP/1.1 200 OK 7ms] [09:12:02.491] POST http : //localhost/inventory/pick-print-results.php [HTTP/1.1 200 OK 7ms] – nodsdorf

+0

은 원래 게시물에 내 알림 (데이터)을 게시했습니다. – nodsdorf

+0

mm XHR 응답을 보거나 오류 메서드를 설정하려고 시도합니다. 귀하의 아약스 함수 같은 : 오류 : 함수 (xhr, ajaxoptions, thrownError) {경고 (thrownError)} – viruskimera