2013-07-08 64 views
1

我正在使用ajax實現一個帶有文本字段的彈出式窗口,該窗口允許在不提交表單的情況下在下拉菜單中創建新選項。這不是很有效。關鍵問題似乎是我無法獲得字符串new_option到PHP。在下面的$ _POST數組中如何是空的?ajax怎麼沒有發佈一個字符串?

<script type="text/javascript"> 

$.ajaxSetup ({ 
    cache: false 
}); 

$('#upload_form option[value="addnew"]').click(function() { 

    // Show modal window 
    $('#add-new').modal('show'); 
    $('#add-new-submit').on('click', function() { 

    // Get new option from text field 
    var new_option = $('#add-new-text').val(); 
    console.log(new_option); 


    $.ajax({ 
     type: "POST", 
     url: "<?php echo site_url(); ?>main/upload_page", 
     data: {new_option:'new_option'} 
    }).fail(function (jqXHR, textStatus, errorThrown) { 
     console.error("The following error occured: " + textStatus, errorThrown); 
    }); 

    $('#add-new').modal('toggle');        
    }); 

}); 

</script> 


<?php 
$new_option = $_POST['new_option']; # <----- Gives Undefined index error 
        //var_dump($new_option); 

// When I get this working this is how I'll get $new_option 
if(isset($new_option)) 
{ 
    $new_option = $_POST['new_option']; 
    $species = array($new_option => $new_option) + $species; 
    //print_r($new_option); 
    //print_r($species); 
    var_dump($new_option); 
} 

?> 

在我看到輸入的字符串(new_option)的控制檯,但PHP給出一個錯誤:在$ new_option = $ _POST [ 'new_option'](未定義索引new_option)。我已經嘗試了一個巨大的事情,似乎無法得到PHP的new_option。我錯過了明顯的東西嗎?在此先感謝您的幫助!

+1

@JonRed - 不,如果是這樣的話,那麼你永遠不能發送多個數據。 –

+0

嘗試添加'dataType:'json''? – Timber

+1

var_dump($ _ POST);輸出是什麼? – Shomz

回答

0

試試這個改變ajax變量名也去掉單引號'角落找尋變量

var new_option_to_send = $('#add-new-text').val(); 

而且在ajax通話

data: {new_option:new_option_to_send } 
+0

這將如何解決PHP中缺少的索引? – Shomz

+0

@Shomz,問題是在JavaScript方面,而不是PHP。 – ocanal

+0

它只是一個嘗試:)我沒有提到,這將解決問題 –

3

有一對夫婦的事情,我看錯你AJAX請求:

1,URL

目前您的使用:

url: "<?php echo site_url(); ?>main/upload_page",

您需要確保URL是正確的,如果你看看源代碼,它看起來是正確的,你可以去到URL,如果你把它粘貼到您的瀏覽器。我假設您使用的是WordPress的'site_url(),它不會在域名之後添加斜槓。可能的解決方法:

url: "<?php echo site_url('/'); ?>main/upload_page", 

2,數據

目前您使用: data: {new_option:'new_option'}

這將發出一個POST['new_option'] = 'new_option';。你需要從周圍的值刪除單引號:

data: {new_option:new_option} 
+0

有沒有人讀過完整的問題?它缺少PHP中的索引。 – Shomz

+0

這就是爲什麼我提到他需要能夠轉到URL,如果他在源代碼中查看它 –

+0

這是真的 - 但我認爲URL是正確的,因爲它確實輸出錯誤,對吧? – Shomz

-1

首先是修改數據瓦爾像:

data: "new_option="+new_option, // like url encoding 

其次,是笨的代碼?

<?php echo site_url(); ?> 

然後在控制器 「主/ upload_page」 嘗試:

$new_option = $this->input->post('new_option'); // only for codeigniter no other framework 

還,用於調試JS + PHP Ajax調用使用克羅姆瀏覽器。它會在網絡(Ctrl + Shift + J)選項卡中顯示您的請求和響應。嘗試PHP結束下面的代碼,以便ü可以看到網絡選項卡

var_dump($_POST); 
+0

是的,這是Codeigniter。我試過$ new_option = $ this-> input-> post('new_option');但仍然得到相同的錯誤。 var_dump($ _ POST)給出一個空數組,var_dump($ new_option)給出bool(false)。 – MysticalTautologist

0

輸出閱讀你的問題,目前所有的答案和評論,唯一的結論,我可以讓之後是所有的代碼,您已經發布上面是在同一個文件中。

因此,$_POST['new_option']將在您首次訪問該頁面時未定義,但應在您發送請求時定義。

只需更改您的代碼以使用isset()在訪問它之前檢查要設置的值,並且錯誤應該消失。

<?php 
if (isset($_POST['new_option'])) { 
    // Do your stuff here 
} 

//編輯

一般來說這不是一個問題,在同一個文件中的代碼,但不要指望$ _ POST數據請求您的瀏覽器頁面時進行定義,因爲不是。

當你打開你的瀏覽器頁面,它將發送一個GET請求到服務器,服務器將搜索根據PHP腳本,並將其與包含在請求中的所有信息傳遞給PHP處理器,沿。 因此,處理器將處理該腳本,執行其中的所有PHP代碼,並將結果傳回您的Web服務器,並將其傳遞到您的瀏覽器。 您的瀏覽器將收到的數據不再包含任何PHP代碼。

現在您更改表單中的選項。這會觸發你的Javascript代碼,它發送一個AJAX請求到你的服務器,調用相同的URL。但是這次是包含您的數據的POST請求。這個過程幾乎是一樣的,但是現在變量已經設置好了,並且將由PHP處理器進行評估。並將回覆發送給您的Javascript代碼。

如果您想要保存接收到的數據,只需檢查Request方法/如果您的變量已設置,並保存它,如果它被保存。

<?php 
if ($_SERVER['REQUEST_METHOD'] === 'GET') { 
?> 

    // your html/javascript stuff here 

<?php 
} else if (isset($_POST['new_value']) { 

    // do whatever you want with the received data 

} else { // Not a valid request for this Script, send according HTTP-Status 
    http_response_code(400); // or header(' ', true, 400); if you're using a PHP-Version < 5.4.0 
} 

如果你wan't改變文檔的任何用戶當前正在觀看在他的瀏覽器基於他choosen選項,你需要使用JavaScript來做到這一點。 PHP只能在服務器端運行,因此不會影響客戶端PC上的任何內容。

要檢查是否如預期般試試這個您的POST請求的進展:

  1. 添加echo $_POST['new_option'];else if分支

  2. 使用Chrome打開網頁

  3. 打開開發人員工具(https://developers.google.com/chrome-developer-tools/

  4. open th E網絡選項卡

  5. 設置過濾器來改變你的選擇

  6. 現在一個新的請求,在該列表中將會彈出

  7. 點擊它

XHR

  • 觸發您的要求

    現在您應該可以看到服務器對POST請求的響應,如果響應包含NS你sended的價值,你的代碼工作

  • +0

    當我這樣做時,它永遠不會被設置(因爲$ _POST是空的),即使我在彈出窗口中輸入新選項後在控制檯中看到我的字符串。而且,是的,這段代碼全部在同一個文件中。這是問題嗎?如果全部在同一個文件中,我需要改變什麼? – MysticalTautologist

    +0

    確保它不會在您的瀏覽器請求頁面上設置,因爲它是一個GET請求,並且不會將數據發送到服務器。當您在控制檯中看到您的字符串時,這將意味着您的代碼可以正常工作,因爲這是對您的請求的響應,但您不能期望PHP會在該時刻之後在該時刻使用瀏覽器查看的文檔中設置該變量已經生成併發送給您。 –

    +0

    我編輯答案做進一步解釋。請將它標記爲答案,如果它幫助你解決你的問題/提高你對PHP的理解:) –

    0

    OK嘗試這些步驟如下:

    1)打開谷歌克羅默瀏覽器,並跳轉到你的應用程序的鏈接

    2)按Ctrl + Shift + J將開放crome的調試器。選擇網絡選項卡。不要關閉這個debuger,直到步驟#4

    3)打開你的模態表單,然後點擊提交。

    4)Ajax請求將顯示在網絡選項卡中。點擊它會顯示u header/preview/respnse。在標題中檢查請求URL是否正確?如果沒有,你得到了你的bug!

    5)所以網址是正確的,我認爲。點擊Response tab你看到了什麼? var_dump($ _ POST)給出了一個空數組,var_dump($ new_option)給出了bool(false)?

    6)打開控制器(主)方法(上載)和寫入上傳方法裏面以下代碼:

    if($this->input->post()){ 
        $new_option=$this->input->post("new_option"); 
        //do what u want to do with it. 
    }else{ 
        //no posting at all? lets see what u got 
        var_dump($_REQUEST); 
    } 
    

    7)重新執行從步驟#1至步驟#5

    我認爲它會解決你的問題,或者至少你可能知道發生了什麼..

    相關問題