Tie repeat jquery

Navigation
1

Dear, I have a problem and I still can not find a solution, I'm still new to jquery, I'd like a little help, please. In the code below I have a procedure to call a dialog, which will be loaded with a table filled with php. This table has an input text field for search and all lines have a checkbox, for when selected and the button pressed, the name is sent to the previous page. Everything is working perfectly, however I have to repeat the code 3 times, if you want to use in 3 different fields. I would like to know how I can pass the clicked button id and from it do an if and execute procedure. It must be something simple, but I have not got it yet. Thanks 

                <script>
            $(document).ready(function(){   
                $("#buttonP1").click(function() {getValueUsingClass1();});
                $("#buttonP2").click(function() {getValueUsingClass2();});
                $("#buttonP3").click(function() {getValueUsingClass3();});
                function getValueUsingClass1(){
                /* declare an checkbox array */
                var chkArray = [];
                /* look for all checkboes that have a class 'chk' attached to it and check if it was checked */
                $(".chk:checked").each(function() {
                    chkArray.push($(this).val());
                });
                var teste = $(this).id;
                alert(teste);
                /* we join the array separated by the comma */
                var selected;
                selected = chkArray.join('') + "";

                /* check if there is selected checkboxes, by default the length is 1 as it contains one single comma */
                if(selected.length > 1){
                    if(chkArray.length > 1){
                    alert("Selecione um campo");
                    $('input[id=TP_ACO_P]').val("");
                    }else{  
                    $('input[id=TP_ACO_P]').val(selected);}
                }else{
                    alert("Nenhuma dado selecionado");  
                }
                $('input[id=buscar]').val("");
            }
                function getValueUsingClass2(){
                /* declare an checkbox array */
                var chkArray = [];

                /* look for all checkboes that have a class 'chk' attached to it and check if it was checked */
                $(".chk:checked").each(function() {
                    chkArray.push($(this).val());
                });

                /* we join the array separated by the comma */
                var selected;
                selected = chkArray.join('') + "";

                /* check if there is selected checkboxes, by default the length is 1 as it contains one single comma */
                if(selected.length > 1){
                    if(chkArray.length > 1){
                    alert("Selecione um campo");
                    $('input[id=ACAB_P]').val("");
                    }else{  
                    $('input[id=ACAB_P]').val(selected);}
                }else{
                    alert("Nenhuma dado selecionado");  
                }
            }
                function getValueUsingClass3(){
                /* declare an checkbox array */
                var chkArray = [];

                /* look for all checkboes that have a class 'chk' attached to it and check if it was checked */
                $(".chk:checked").each(function() {
                    chkArray.push($(this).val());
                });

                /* we join the array separated by the comma */
                var selected;
                selected = chkArray.join('') + "";

                /* check if there is selected checkboxes, by default the length is 1 as it contains one single comma */
                if(selected.length > 1){
                    if(chkArray.length > 1){
                    alert("Selecione um campo");
                    $('input[id=TT_P]').val("");
                    }else{  
                    $('input[id=TT_P]').val(selected);}
                }else{
                    alert("Nenhuma dado selecionado");  
                }
                $('input[id=buscar]').val("");
            }
            $(function() {
                $( "#dialogP1" ).dialog({
                resizable: false,
                  height:400,
                  width:500,
                  modal: true,
                  autoOpen: false,
                  open: function(event, ui) {  
                    $('.ui-dialog-titlebar').display("none");  

                }

                });
                $( "#openerP1" ).click(function() {
                $('input:checkbox').attr('checked',false);
                  $( "#dialogP1" ).dialog( "open" );

                });
                $( "#buttonP1" ).click(function() {
                  $( "#dialogP1" ).dialog( "close" );
                });
              });
            $(function(){$("#dialogP1").dialog().parents(".ui-dialog").find(".ui-dialog-titlebar").remove();});

            $(function() {
                $( "#dialogP2" ).dialog({
                resizable: false,
                  height:400,
                  width:500,
                  modal: true,
                  autoOpen: false,
                  open: function(event, ui) {  
                    $('.ui-dialog-titlebar').display("none");  

                }
                });

                $( "#openerP2" ).click(function() {
                $('input:checkbox').attr('checked',false);
                  $( "#dialogP2" ).dialog( "open" );
                });
                $( "#buttonP2" ).click(function() {
                  $( "#dialogP2" ).dialog( "close" );
                });
              });
            $(function(){$("#dialogP2").dialog().parents(".ui-dialog").find(".ui-dialog-titlebar").remove();});

            $(function() {
                $( "#dialogP3" ).dialog({
                resizable: false,
                  height:400,
                  width:500,
                  modal: true,
                  autoOpen: false,
                  open: function(event, ui) {  
                    $('.ui-dialog-titlebar').display("none");  

                }
                });

                $( "#openerP3" ).click(function() {
                $('input:checkbox').attr('checked',false);
                  $( "#dialogP3" ).dialog( "open" );
                });
                $( "#buttonP3" ).click(function() {
                  $( "#dialogP3" ).dialog( "close" );
                });
              });
            $(function(){$("#dialogP3").dialog().parents(".ui-dialog").find(".ui-dialog-titlebar").remove();});
            });
            </script>
    
asked by anonymous 15.09.2014 / 21:49

2 answers

1
  

I would like to know how to pass the clicked button id and from   make it an if and execute the procedure.

Use a class in your buttons. Example: class 'buttons'. You will only need to call it once and it will pass its id to the function (a function only). 

<script>
$(document).ready(function(){   
    $(".botao").click(function() {
        getValueUsingClass($(this).attr("id"));
    });

    function getValueUsingClass(idBotao){
        var chkArray = [];

        $(".chk:checked").each(function() {
            chkArray.push($(this).val());
        });                 

        alert(idBotao);

        var selected;
        selected = chkArray.join('') + "";

        if(selected.length > 1){
            if(chkArray.length > 1){
            alert("Selecione um campo");
            $('input[id=TP_ACO_P]').val("");
            }else{  
            $('input[id=TP_ACO_P]').val(selected);}
        }else{
            alert("Nenhuma dado selecionado");  
        }
        $('input[id=buscar]').val("");
    }

    $(function() {
        $( "#dialogP1" ).dialog({
            resizable: false,
            height:400,
            width:500,
            modal: true,
            autoOpen: false,
            open: function(event, ui) {  
                $('.ui-dialog-titlebar').display("none"); 
            }
        });

        $( "#openerP1" ).click(function() {
            $('input:checkbox').attr('checked',false);
            $( "#dialogP1" ).dialog( "open" );
        });

        $( "#buttonP1" ).click(function() {
            $( "#dialogP1" ).dialog( "close" );
        });
    });

    $(function(){
        $("#dialogP1").dialog().parents(".ui-dialog").find(".ui-dialog-titlebar").remove();
    });

    $(function() {
        $( "#dialogP2" ).dialog({
            resizable: false,
            height:400,
            width:500,
            modal: true,
            autoOpen: false,
            open: function(event, ui) {  
                $('.ui-dialog-titlebar').display("none"); 
            }
        });

        $( "#openerP2" ).click(function() {
        $('input:checkbox').attr('checked',false);
            $( "#dialogP2" ).dialog( "open" );
        });
        $( "#buttonP2" ).click(function() {
            $( "#dialogP2" ).dialog( "close" );
        });
    });

    $(function(){
        $("#dialogP2").dialog().parents(".ui-dialog").find(".ui-dialog-titlebar").remove();
    });

    $(function() {
        $( "#dialogP3" ).dialog({
            resizable: false,
            height:400,
            width:500,
            modal: true,
            autoOpen: false,
            open: function(event, ui) {  
                $('.ui-dialog-titlebar').display("none"); 
            }
        });

        $( "#openerP3" ).click(function() {
            $('input:checkbox').attr('checked',false);
            $( "#dialogP3" ).dialog( "open" );
        });

        $( "#buttonP3" ).click(function() {
            $( "#dialogP3" ).dialog( "close" );
        });
    });

    $(function(){
        $("#dialogP3").dialog().parents(".ui-dialog").find(".ui-dialog-titlebar").remove();
    });
});
</script>
    
15.09.2014 / 22:50
1

Have you ever come to test the jQuery selector by class? You can define specific names of the classes you want to have the functions linked and use them as a selector, see: 

<script>
$(document).ready(function () {
    $("#buttonP1").click(function () { getValueUsingClass("TP_ACO_P"); });
    $("#buttonP2").click(function () { getValueUsingClass("ACAB_P"); });
    $("#buttonP3").click(function () { getValueUsingClass("TT_P"); });

    function getValueUsingClass(id) {
        /* declare an checkbox array */
        var chkArray = [];
        /* look for all checkboes that have a class 'chk' attached to it and check if it was checked */
        $(".chk:checked").each(function () {
            chkArray.push($(this).val());
        });
        var teste = $(this).id;
        alert(teste);
        /* we join the array separated by the comma */
        var selected;
        selected = chkArray.join('') + "";

        /* check if there is selected checkboxes, by default the length is 1 as it contains one single comma */
        if (selected.length > 1) {
            if (chkArray.length > 1) {
                alert("Selecione um campo");
                $('input[id=' + id + ']').val("");
            } else {
                $('input[id=' + id + ']').val(selected);
            }
        } else {
            alert("Nenhuma dado selecionado");
        }
        $('input[id=buscar]').val("");
    }

    $(function () {
        $(".dialog").dialog({
            resizable: false,
            height: 400,
            width: 500,
            modal: true,
            autoOpen: false,
            open: function (event, ui) {
                $('.ui-dialog-titlebar').display("none");

            }
        });
        $(".opener").click(function () {
            $('input:checkbox').attr('checked', false);
            $(".dialog").dialog("open");

        });
        $(".button").click(function () {
            $(".dialog").dialog("close");
        });
    });
});
</script>

Maybe this is not the solution, but it can point you to it.

    
15.09.2014 / 22:04
Error in PROCEDURE [closed] How to upload multiple images to SQL Server using JSON in ASP.Net MVC?