Tengo el Siguiente ActionResult en un Controlador. devuelve una fila de datos(como id, nombre, ciudad, etc) a partir de la base de datos dependiendo de la IDENTIFICACIÓN de

    [HttpPost]
    public ActionResult Get(Guid Id)
    {
        Ref imp = ReadRepository.GetById(refImpId);
        var ijson =  new JsonResult() { Data = imp.ToJson() };
        return ijson;
    }

el Siguiente es el JQuery y Ajax de Jquery Diálogo.

$(".ImpList").click(function (e) {

    // get the imp id
    var refImpId = $(this).next('#impId').val();
    var impgeturl = $('#impgeturl').val();
    var imptoedit = null;

    $.ajax({
        type: 'post',
        url: impgeturl,
        data: '{ "refImpId": "' + refImpId + '" }',
        contentType: "application/json; charset=utf-8",
        traditional: true,
        success: function (data) {
            imptoedit = jQuery.parseJSON(data);


            $("#editImpDialog").dialog({
                width: 350,
                height: 220,
                modal: true,
                draggable: false,
                resizable: false,
            });

        },
        error: function (request, status, error) {
            alert(e);  // TODO:  need to discuss ajax error handling and form reset strategy.
        }
    });
});

$("#cancelEditImpBtn").click(function (e) {
    e.preventDefault();
    $('#editImpDialog').dialog("close");
});

$("#saveEditImpBtn").click(function (e) {
    e.preventDefault();
    $("form").submit();
});

Tengo un cuadro de Diálogo, en mi Opinión. Necesito Mostrar los Datos Json en el diálogo Jquery. ¿Cómo puedo hacer eso?

  • Usted no está utilizando el parámetro en la Acción. Su código es realmente eso?
InformationsquelleAutor InCommand | 2012-04-05

3 Comentarios

  1. 1
    $.post("/echo/json/",function(data){
     //in actuality the json will be parsed here
        var d = '{"id":"1","name":"john","age":26}';
        var json = $.parseJSON(d);
        $("<div/>",{text:json.name+" "+json.age}).appendTo("body");
        $("div").dialog();
    
    },'json')

    DEMO

  2. 1

    Hay un montón de maneras de hacerlo. Aquí está un ejemplo: http://geekswithblogs.net/michelotti/archive/2008/06/28/mvc-json—jsonresult-and-jquery.aspx

    Básicamente, usted tiene acceso a las propiedades de la data parámetro de la success controlador.

    ...
    success: function (data) {
        alert(data.property);
    }
    ...

    Una cosa a tener en cuenta es agregar el dataType: "json" opción en la llamada AJAX, así que usted no tiene que analizar los datos después de su recepción.

  3. 0

    Este código funciona bien para mí:

    <!DOCTYPE HTML>
    <html>
    <head>
    <meta charset="UTF-8">
    <title>JSON Dialog</title>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/5.5.5/jsoneditor.min.css" rel="stylesheet" type="text/css" />
    <link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0-rc.2/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-rc1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.0-rc.2/jquery-ui.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jsoneditor/5.5.5/jsoneditor.min.js"></script>
    <script>    
    function jsonDialog(jsonobj, modes, okcallback, cancelcallback, errorcallback) {
    if (jsonobj === undefined || jsonobj === null) {
    if (errorcallback !== undefined)
    errorcallback("JSON Object is not valid");
    return false;
    }
    var jsoncontent = document.createElement('div');
    jsoncontent.style.display = "none";
    document.body.appendChild(jsoncontent);
    var jsoneditor = document.createElement('div');
    jsoneditor.style.width = '398px';
    jsoneditor.style.height = '500px';
    jsoncontent.appendChild(jsoneditor);
    if (modes === undefined || modes === null)
    modes = {mode: 'tree', modes: ['form', 'text', 'tree', 'view']};
    var editor = new JSONEditor(jsoneditor, modes);
    editor.set(jsonobj);
    var destroy = function() {
    editor.destroy();
    jsoneditor.remove();
    $(jsoncontent).dialog('close');
    jsoncontent.remove();   
    $('.ui-dialog').remove();
    };
    $(jsoncontent).dialog({
    height: 560,
    width: 400,
    modal: true,
    resizable: false,
    position: {
    my: "center",
    at: "center",
    of: window
    },
    buttons: [{
    text: "OK",
    style:"margin-right:40px; color:#3883fa;",
    click: function () {
    var result = editor.get();
    destroy();
    if (okcallback !== undefined)
    okcallback(result);                     
    }
    }, {
    text: "Cancel",
    style:"color:#EE422E;",
    click: function () {
    destroy();
    if (cancelcallback !== undefined)
    cancelcallback();
    }
    }]
    });
    $(".ui-dialog-titlebar-close").css('visibility','hidden');
    $(".ui-dialog-titlebar").css('visibility','hidden');
    $(".ui-dialog").css('border-style','none');
    $(".ui-dialog").css('text-align','center');
    $(".ui-button").css('width','100px');
    $(".ui-button").css('margin-top','10px');
    $(".ui-button").css('margin-bottom','10px');
    return true;
    }
    $(document).ready(function() {
    $("#test").click(function() {
    var jsonstr = '{"key": [1, 2, 3],"anotherkey": true,"somekey": null,"anykey": 123,"justakey": {"a": "b", "c": "d"},"otherkey": "Hello World"}';
    var jsonobj = JSON.parse(jsonstr); //MANDATORY
    var modes = {mode: 'tree', modes: ['form', 'text', 'tree']}; //OPTIONAL
    var okcallback = function(jsonobj){ alert( JSON.stringify(jsonobj)); }; //OPTIONAL
    var cancelcallback = function(){ }; //OPTIONAL
    var errorcallback = function(e){ alert(e); }; //OPTIONAL
    jsonDialog(jsonobj, modes, okcallback, cancelcallback, errorcallback);
    });
    });
    </script>
    </head>
    <body>
    <button id="test">Test</button>
    </body>
    </html>

Dejar respuesta

Please enter your comment!
Please enter your name here