Formulário somente Visualização

Como faço pra deixar um formulario somente para visualização apos ser salvo ?

criado 19 de Jul de 2018
willian carlos
84 pontos
editado 19 de Jul de 2018

Você vai ver essas setas em qualquer página de pergunta. Com elas, você pode dizer se uma pergunta ou uma resposta foram relevantes ou não.
Edite sua pergunta ou resposta caso queira alterar ou adicionar detalhes.
Caso haja alguma dúvida sobre a pergunta, adicione um comentário. O espaço de respostas deve ser utilizado apenas para responder a pergunta.
Se o autor da pergunta marcar uma resposta como solucionada, esta marca aparecerá.
Clique aqui para mais detalhes sobre o funcionamento do fluig Forum!

2 respostas

Você pode bloquear todo o formulário, impedindo edição das informações:

enableContainer($("form")[0],false);

script:

function enableContainer($el, enabled){
    $($el).find("input[type='radio'],input[type='text'],input[type='checkbox'],textarea,select,input[type='button'],img").each(function (i) {
        enableField($(this), enabled);
    });
};
function enableField($el, enabled){
    if($el.attr("type") == "text"){
        $el.prop("readonly",!enabled);
        //se possui botao agrupado desabilita tambem
        if(enabled == false){
            $el.parent().find('.input-group-addon').css("pointer-events", "none");
            $el.parent().find('.in    put-group-addon').children().css("opacity", 0.4);
        }
        else{
            $el.parent().find('.input-group-addon').css("pointer-events", "auto");
            $el.parent().find('.input-group-addon').children().css("opacity", 1);
        }
    }
    else if($el.prop("tagName") == "TEXTAREA"){
        $el.prop("readonly",!enabled);;
    }
    else if($el.prop("tagName") == "SELECT"){
        disableField($el, enabled);
    }
    else if($el.attr("type") == "button" || $el.prop("tagName") == "IMG"){
        $el.prop("disabled",!enabled);
        if(enabled){
            $el.css("opacity", 1);
            $el.css("filter", "");
            if($el.data("click-event") != ""){
                $el.on("click", $el.data("click-event"));
                $el.data("click-event", "");
            }
        } else {
            $el.css("opacity", 0.4);
            $el.css("filter", "alpha(opacity=40)");
            $el.data("click-event", $el.get(0).onclick);
            $el.off();
            $el.get(0).onclick = "";
        }
    }
    else if($el.attr("type") == "radio" || $el.attr("type") == "checkbox" || $el.attr("type") == undefined){
        var endWithDisabled = new RegExp(/_d$/);
        var nameOf = ($el.selector.replace("#","") != "") ? $el.selector.replace("#","") : $el.attr("name");

        $el = $("[name='" + nameOf + "']").filter(function(index, element) {
            return !endWithDisabled.test(element.id);        });

        if($el.length && $el.length > 0 && ($el.attr("type") == "radio" || $el.attr("type") == "checkbox")){
            $el.each(function(i){
                $("label[for^='"+$(this).prop("id")+"']").each(function (i) {
                    var suffix = (endWithDisabled.test($(this).prop("for"))) ? "_d" : "";
                    if(enabled){
                        $(this).prop("for", $(this).prop("for").replace(endWithDisabled,""));
                    }
                    else if(suffix == ""){
                        $(this).prop("for", $(this).prop("for")+"_d");
                    }
                });
                disableField($(this), enabled);
            });
        }
    }
}

editar
- x
grosseiro ou ofensivo pouco construtivo obsoleto outro...
Motivo

criado 19 de Jul de 2018
Tiago Volpi
376 pontos

0

Qual evento utilizo pra usar este codigo pois não encontro enableContainer
— willian carlos 19 de Jul de 2018

0

Esse código você pode rodar no lado cliente. Colocar dentro do seu .js
— Tiago Volpi 19 de Jul de 2018

0

entendi mas em que aonde eu insiro a chamada da funçao enableContainer($("form")[0],false);?
— willian carlos 19 de Jul de 2018

0

Dentro do document.ready: $(document).ready(function () { enableContainer($("form")[0],false); }
— Tiago Volpi 19 de Jul de 2018

Desculpe tiago mas sou novato em desenvolvimento coloquei o codigo na seguinte forma


<html>
<head>
    <link type="text/css" rel="stylesheet" href="/portal/resources/style-guide/css/fluig-style-guide.min.css"/>
    <script type="text/javascript" src="/portal/resources/js/jquery/jquery.js"></script>
    <script type="text/javascript" src="/portal/resources/js/jquery/jquery-ui.min.js"></script>
    <script type="text/javascript" src="/portal/resources/js/mustache/mustache-min.js"></script>
    <script type="text/javascript" src="/portal/resources/style-guide/js/fluig-style-guide.min.js" charset="utf-8"></script>
</head>
<body>
<div class="fluig-style-guide">
    <form name="form" role="form">
            <div class="row">
                <div class="panel panel-primary">
                    <div class="panel-heading">
                        <h2 class="panel-title"><span class="fluigicon fluigicon-user fluigicon-md"></span> Inclusão de Titulos via fluig x Protheus </h2>
                    </div>
                    <div class="panel-body">
                            <div class="form-group col-md-2">
                                <label for="CCGC"> Filial: </label>
                                <input type="text" name="CCGC" id="CCGC" class="form-control" size="4" maxlength="4" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CCLIENTE"> Código Cliente: </label>
                                <input type="text" name="CCLIENTE" id="CCLIENTE" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CCONTRATOMDW"> Nº Contrato: </label>
                                <input type="text" name="CCONTRATOMDW" id="CCONTRATOMDW" class="form-control" size="9" maxlength="9" required="required" >
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CHISTTIT"> Mensagem da Nota: </label>
                                <input type="text" name="CHISTTIT" id="CHISTTIT" class="form-control"size="300" maxlength="300" required="required">
                            </div>
                               <div class="form-group col-md-2">
                                 <label for="CDTEMISSAO"> Data de Emissao: </label>
                                 <input type="text" name="CDTEMISSAO" id="CDTEMISSAO" class="form-control" mask="00/00/0000" required="required">
                              </div>
                               <div class="form-group col-md-2">
                                 <label for="CDTRVENCTO"> Data de Vencimento Real do Título: </label>
                                 <input type="text" name="CDTRVENCTO" id="CDTRVENCTO" class="form-control" mask="00/00/0000" required="required">
                              </div>
                            <div class="form-group col-md-2">
                                <label for="CNATUREZA"> Natureza: </label>
                                <input type="text" name="CNATUREZA" id="CNATUREZA" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CPIMDW"> PI: </label>
                                <input type="text" name="CPIMDW" id="CPIMDW" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CTIPOFAT"> Tipo de Faturamento: </label>
                                <input type="text" name="CTIPOFAT" id="CTIPOFAT" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CTITULO"> Titulo: </label>
                                <input type="text" name="CTITULO" id="CTITULO" class="form-control" size="9" maxlength="9" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="CVENDEDOR"> Vendedor: </label>
                                <input type="text" name="CVENDEDOR" id="CVENDEDOR" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="NCOMISSAO"> Comissão: </label>
                                <input type="number" name="NCOMISSAO" id="NCOMISSAO" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="NQUANTIDADE"> Parcelas: </label>
                                <input type="number" name="NQUANTIDADE" id="NQUANTIDADE" class="form-control" required="required">
                            </div>
                            <div class="form-group col-md-2">
                                <label for="NVALOR"> Valor do Contrato : </label>
                                <input type="number" name="NVALOR" id="NVALOR" class="form-control" required="required">
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
</body>

<script type="text/javascript">
        var calendario = FLUIGC.calendar('#CDTEMISSAO', '#CDTRVENCTO', '#CDTVENCTO');

         $(document).ready(function () { enableContainer($("form")[0],false); }

        function enableContainer($el, enabled){
            $($el).find("input[type='radio'],input[type='text'],input[type='checkbox'],textarea,select,input[type='button'],img").each(function (i) {
                enableField($(this), enabled);
            });
        };
        function enableField($el, enabled){
            if($el.attr("type") == "text"){
                $el.prop("readonly",!enabled);
                //se possui botao agrupado desabilita tambem
                if(enabled == false){
                    $el.parent().find('.input-group-addon').css("pointer-events", "none");
                    $el.parent().find('.in    put-group-addon').children().css("opacity", 0.4);
                }
                else{
                    $el.parent().find('.input-group-addon').css("pointer-events", "auto");
                    $el.parent().find('.input-group-addon').children().css("opacity", 1);
                }
            }
            else if($el.prop("tagName") == "TEXTAREA"){
                $el.prop("readonly",!enabled);;
            }
            else if($el.prop("tagName") == "SELECT"){
                disableField($el, enabled);
            }
            else if($el.attr("type") == "button" || $el.prop("tagName") == "IMG"){
                $el.prop("disabled",!enabled);
                if(enabled){
                    $el.css("opacity", 1);
                    $el.css("filter", "");
                    if($el.data("click-event") != ""){
                        $el.on("click", $el.data("click-event"));
                        $el.data("click-event", "");
                    }
                } else {
                    $el.css("opacity", 0.4);
                    $el.css("filter", "alpha(opacity=40)");
                    $el.data("click-event", $el.get(0).onclick);
                    $el.off();
                    $el.get(0).onclick = "";
                }
            }
            else if($el.attr("type") == "radio" || $el.attr("type") == "checkbox" || $el.attr("type") == undefined){
                var endWithDisabled = new RegExp(/_d$/);
                var nameOf = ($el.selector.replace("#","") != "") ? $el.selector.replace("#","") : $el.attr("name");

                $el = $("[name='" + nameOf + "']").filter(function(index, element) {
                    return !endWithDisabled.test(element.id);        });

                if($el.length && $el.length > 0 && ($el.attr("type") == "radio" || $el.attr("type") == "checkbox")){
                    $el.each(function(i){
                        $("label[for^='"+$(this).prop("id")+"']").each(function (i) {
                            var suffix = (endWithDisabled.test($(this).prop("for"))) ? "_d" : "";
                            if(enabled){
                                $(this).prop("for", $(this).prop("for").replace(endWithDisabled,""));
                            }
                            else if(suffix == ""){
                                $(this).prop("for", $(this).prop("for")+"_d");
                            }
                        });
                        disableField($(this), enabled);
                    });
                }
            }
        }
    </script>

</html>

editar
- x
grosseiro ou ofensivo pouco construtivo obsoleto outro...
Motivo

criado 20 de Jul de 2018
willian carlos
84 pontos

fluig forum

Formulário somente Visualização

Comentário

2 respostas

Comentário

Comentário

Não é a resposta que estava procurando? Procure outras perguntas com as tags formulario fluig ou faça a sua própria pergunta.