0

我正在尝试制作一个动态文档预览器。用户可以输入某些文档标题选项,并根据他们的帐户信息生成具有动态标题的文档。我最终想预览一个完整的 pdf,但我现在只处理标题。

我想要做的是制作一个用户可以填写的表单页面,然后按一个按钮来预览标题。

$.ajaxSetup({
type:       'POST',
timeout:    10000
});

$("#preview_header").click(function(){
    var full_url = //appropriate URL 

    var preview_data = {    
        "wsid":             "default",
        "page":             "default",
        "banner_area1":     "default",
        "banner_area2":     "default",
        "banner_area3":     "default",
        "uid":              "default",
        "fid":              "default",
        "cid":              "default",
        "assignment_type":  "default"
    };

    preview_data.wsid               = $("#worksheet_picker").val();
    preview_data.page               = $("#page_picker").val();
    preview_data.banner_area1       = $("#banner_area1").val();
    preview_data.banner_area2       = $("#banner_area2").val();
    preview_data.banner_area3       = $("#banner_area3").val();
    preview_data.uid                = $("#member_uid").val();
    preview_data.fid                = $("#family_id").val();
    preview_data.assignment_type    = 'family';
    preview_data.cid                = $("#class_id").val();

    var JSONText = JSON.stringify( preview_data );
    alert('Full JSON - ' + JSONText);

    $.ajax({
        async: true,
        url: full_url,
        data: { previewInfo : JSONText }, //Passes necessary form information
        dataType: 'json',
        success: function(output){
            var reply = output;
            if ( reply.status == "success" ){
                $("#preview").attr("src", reply.image );
            } else {
                alert('Failed to create image preview of the assignment.');
            } 
        } 
    });
});

据我所知,上述方法运行良好。它点击了正确的 Codeigniter 页面,当 ajax 方法设置为返回硬编码图像时,它工作得很好。AJAX 的格式似乎很好,但以防万一当我用相应的值填写表单时它会输出:

Full JSON - {"wsid":"4","page":"1","banner_area1":"link1",
"banner_area2":"link2","banner_area3":"link3",
"uid":"1","fid":"1","assignment_type":"family"}

所以首先,让我们从 ajax 回复的相应控制器方法中的工作开始:

$data = array(
'status'    => 'success',
'image'     => //static image link
);

$this->output->set_content_type('text/javascript;charset=UTF-8');
echo json_encode($data);

但是每当我尝试像这样修改它时:

$preview_data = json_decode($this->input->post('previewInfo'));

//Got this one
mail('me@gmail.com', 'Start Email', 'Some email' ); 
//Empty email
mail('me@gmail.com', 'Dump Post', var_dump($_POST)); 
//Empty email
mail('me@gmail.com', 'Post data', var_dump($preview_data) );
//returns an email with 1 for body
mail('me@gmail.com', 'Post data', print_r($this->input->post()) ); 
//returns an email with 1 for body
mail('me@gmail.com', 'Post data', 
     print_r($this->input->post('previewInfo')) ); 
//returns an email with 1 for body
mail('me@gmail.com', 'Post data', print_r($preview_data) );

$data = array(
'status'    => 'success',
'image'     => //static image link
);

$this->output->set_content_type('text/javascript;charset=UTF-8');
echo json_encode($data);

修改后的也不返回静态数据。所以看起来 post 数组没有被正确初始化。有人看到这个错误吗?

4

2 回答 2

0

如果您想使用 post 方法发送您的 Ajax 请求,您需要在您的选项中设置type为。POST$.ajax

此外,async默认情况下为 true,因此无需设置。此外,您应该考虑使用.doneand.fail而不是successand fail,因为它们很快就会被弃用。

像这样:

$.ajax({
    type: "POST",
    url: full_url,
    data: { previewInfo : JSONText }, //Passes necessary form information
    dataType: 'json'
}).done(function (output, textStatus, jqXHR) {
    var reply = output;
    if ( reply.status == "success" ){
        $("#preview").attr("src", reply.image );
    } else {
        alert('Failed to create image preview of the assignment.');
    } 
}).fail(function (jqXHR, textStatus, errorThrown) {
    // now you have the XHR, text status, and error to debug with
});
于 2012-07-17T19:21:52.190 回答
0

有两个问题导致了这个问题的解决:

1)

正如 Austin 和 Gavin 所说: var_dump 和 print_r 不应该输出到浏览器。解决方案是使用 Firefox 扩展/chrome 进行调试。

2)

$preview_data = json_decode($this->input->post('previewInfo'));

改为

$preview_data = json_decode($this->input->post('previewInfo'), true);

json_decode 的第二个可选参数是告诉该方法您期望的是关联对象还是事物列表。碰巧,我正在阅读并想要一个关联数组。

于 2012-08-15T07:29:26.177 回答