jQueryのダイアログにチェックボックスを追加

Question

私はjQueryとJavaScriptを完全に新しくしており、いくつかのコードを変更する必要があります。このダイアログボックスにチェックボックスを追加し、その選択に基づいて決定を下す必要があります。助言がありますか？

function deleteFacets() 
{ 
    // button click 
    $("#b_facetsDelete").button().click(function(){ 
     // selected fIds 
     var $fIds=checkSfALOneSelectedFId(); 
     if(!$fIds) 
     { 
      return; 
     } 
     $('#deleteFacetsDialog').dialog('open');   
     return; 

    }); 

    // dialog 
    $("#deleteFacetsDialog").dialog({ 
     autoOpen: false, 
     resizable: false, 
     height:160, 
     modal: true, 
     buttons: { 
      "Cancel": function() { 
       $(this).dialog('close'); 
      }, 
      "Delete selected facets": function() { 
       $(this).dialog('close'); 

       // get the selected fIds 
       var $fIds=getSfSelectedFIds(); 

       //update database 
       $.ajax({ 
        url: 'ajax/ajax_facetsDelete.php', 
        type: 'POST', 
        data: {"fIds":$fIds}, 
        async: false, 
        dataType: 'xml', 
        error: function(){ 
         alert('Error loading XML document'); 
        }, 
        success: function(data){ 
         //check error 
         var $error=$(data).find('error').text(); 
         if($error!="0") 
         { 
          messageBox("Error",$error); 
          return; 
         } 
         //content 
         var $content=$(data).find('content').text(); 
         //refresh source facets tab 
         var $srcTabIndex=$("#srcFacetsTab").tabs('option', 'selected'); 
         if($content=="0") 
         { 
          messageBox("Succeed!","Delete successfully!"); 
          if($srcTabIndex==0) 
          { // for navigation 
           sfNavRefreshUntilParent(); 
          } 
          else if($srcTabIndex==1) 
          { //for search 
           sfSearchGridRefreshAll(); 
          } 
         } 
         else 
         {              
          messageBox("Warning!", $content+" can not be deleted since they have child facets or terms. <br/>Please empty them first(Move the child facets and move all the terms)."); 
          if($srcTabIndex==0) 
          { // for navigation (refresh and highlight the invalid fIds) 
           sfNavRefreshWithHighlightFIds($content); 
          } 
          else if($srcTabIndex==1) 
          { //for search 
           sfSearchGridRefreshWithHighlightFIds($content); 
          } 
         } 
        } 
       }); 
       return; 
      } 
     } 
    }); 

} 

HTML

<!-- delete facets confirmation dialog --> 
<div id="deleteFacetsDialog" title="Sure to delete?"> 
    <p><span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 20px 0;"></span>These facets will be permanently deleted and cannot be recovered. Are you sure?</p> 
</div> 

Answer 1

ダイアログの体のためのすべてのコードが存在する場所をdeleteFacetsDialog、上.dialog呼んでいるIDは、あります。だからあなたがする必要があるのは、HTMLソース内のそのIDを見つけてその中にチェックボックス（それを囲む必要があるテキスト/ラベル）を追加することです。

あなたの削除関数のコールバックでは、そのチェックボックスにアクセスして値を調べ、if/elseロジックを選択に基づいて行う必要があります。

<div id="deleteFacetsDialog"> 
... 
<label><input type="checkbox" id="permaDelete" />Perminantly delete this facet?</label> 
... 
</div> 

そして：たとえば

... 
"Delete selected facets": function() { 
    ... 
    if ($('#permaDelete').is(':checked')) { 

    } else { 

    } 
    ... 
} 

ただ、あなたがJSで呼んで入力ラインにHTMLに使い切るIDを確認してください。