1

I am absolutly new in JavaScript and JQuery and I have the following problem.

Into a page I have this dialog:

<div id="dialogReject" title="">
    <table style="visibility: hidden;" id="rifiutaTable" border="0" class="standard-table-cls" style="width: 100%!important">
        <tbody style="background-color: #ffffff;">
            <tr>
                <td style="font: 16px Verdana,Geneva,Arial,Helvetica,sans-serif !important">Inserire note di rifiuto</td>
            </tr>
            <tr>
                <td>
                    <textarea style="visibility: hidden;" rows="5" cols="70" id="myRejectNote"></textarea>
                </td>
            </tr>
            <tr>
                <td>
                    <input class="bottone" readonly="readonly" type="text" value="Rifiuta" onclick="rifiuta()"/>
                </td>
            </tr>
        </tbody>
    </table>
</div>

that I think is created by this JQuery script:

$(document).ready(function() {
    larghezza = '950px';
    lunghezza = '470px';
    lunghezza2 = '530px';
    $("#dialogReject").dialog({
         autoOpen: false,
         //width:'335px',
         width:'600px',
         modal: true,
         show: {        
             effect: "blind",
             duration: 500      
         },
         hide: { 
             effect: "blind",   
             duration: 500    
         }
     });
});

As you can see this dialog contains 2 buttons implemented by 2 input tag, these:

<td style="text-align: right">
    <input class="bottone" readonly="readonly" type="text" value="Annulla" onclick="javascript:window.close()"/>

    <input class="bottone" readonly="readonly" type="text" value="Rifiuta" onclick="rifiuta()"/>
</td>

When the user click on the Annulla button I want that the dialog is closed.

Actually I tryied to use the window.close() function but it can't work.

I think that to cloe this dialog I have to use the same event that is performed when the user use the ESC keyboard button that close the dialog with a simple animation.

But I really have no idea about how do it. Can you help me to do it?

Tnx

1
  • I think you want .dialog( "close" ); See jQuery dialog documentation under sections "buttons" and "hide" for example code. jQuery Dialog
    – Yogi
    Commented May 29, 2015 at 10:47

3 Answers 3

2

Try $("#dialogReject").dialog( "close" );

For more info, read https://api.jqueryui.com/dialog/

To bind it, change

<input class="bottone" readonly="readonly" type="text" value="Annulla" onclick="javascript:window.close()"/>

to

<input id="closeDialog" class="bottone" readonly="readonly" type="text" value="Annulla"/>

and add this after: $("#dialogReject").dialog({ [..your code..] });

$("#closeDialog").click(function(){
    $("#dialogReject").dialog( "close" );
})
1
  • mmm where have I to put it? Commented May 29, 2015 at 10:43
1

You have to listen for an event in your javascript file.

First set an id to your close button, i'm using #closeButton here :

$(document).ready(function() {
    larghezza = '950px';
        lunghezza = '470px';
        lunghezza2 = '530px';
    $("#dialogReject").dialog({
                autoOpen: false,
                //width:'335px',
                width:'600px',
                modal: true,
                show: {        effect: "blind",        duration: 500      },
                hide: {        effect: "blind",        duration: 500      }

     });

    $("#closeButton").click(function(){
        $("#dialogReject").close();
    });

});

1

As the answer was given by Alex and kaz $("#dialogReject").close();

Or you can use button which can be created through jquery also

  buttons: {Rifiuta: funstion()
            {
            rifiuta()
            },
              Annulla: function() {
          $( this ).dialog( "close" );
        }

For reference: https://jqueryui.com/dialog/#modal-confirmation

    $( "#dialogReject" ).dialog({
 autoOpen: open,
            //width:'335px',
            width:'600px',
            modal: true,
            show: {        effect: "blind",        duration: 500      },
            hide: {        effect: "blind",        duration: 500      },
  buttons: {Rifiuta: funstion()
            {
            rifiuta()
            },
          Annulla: function() {
      $( this ).dialog( "close" );
    }
  }
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.