2012-03-12 1 views
1

内のリンクボタンをクリックすると、ユーザは私は確認を書かれているGridViewの

<head runat="server"> 
<title></title> 
<style type="text/css"> 
    BODY, HTML 
    { 
     padding: 0px; 
     margin: 0px; 
    } 
    BODY 
    { 
     font-family: Arial, Helvetica, sans-serif; 
     font-size: 12px; 
     background: #FFF; 
     padding: 15px; 
    } 

    H1 
    { 
     font-size: 20px; 
     font-weight: normal; 
    } 

    H2 
    { 
     font-size: 16px; 
     font-weight: normal; 
    } 

    FIELDSET 
    { 
     border: solid 1px #CCC; 
     -moz-border-radius: 16px; 
     -webkit-border-radius: 16px; 
     border-radius: 16px; 
     padding: 1em 2em; 
     margin: 1em 0em; 
    } 

    LEGEND 
    { 
     color: #666; 
     font-size: 16px; 
     padding: 0em .5em; 
    } 

    PRE 
    { 
     font-family: "Courier New" , monospace; 
     font-size: 11px; 
     color: #666; 
     background: #F8F8F8; 
     padding: 1em; 
     -moz-border-radius: 8px; 
     -webkit-border-radius: 8px; 
     border-radius: 8px; 
    } 

    /* Custom dialog styles */ 
    #popup_container.style_1 
    { 
     font-family: Georgia, serif; 
     color: #A4C6E2; 
     background: #005294; 
     border-color: #113F66; 
    } 

    #popup_container.style_1 #popup_title 
    { 
     color: #FFF; 
     font-weight: normal; 
     text-align: left; 
     background: #76A5CC; 
     border: solid 1px #005294; 
     padding-left: 1em; 
    } 

    #popup_container.style_1 #popup_content 
    { 
     background: none; 
    } 

    #popup_container.style_1 #popup_message 
    { 
     padding-left: 0em; 
    } 

    #popup_container.style_1 INPUT[type='button'] 
    { 
     border: outset 2px #76A5CC; 
     color: #A4C6E2; 
     background: #3778AE; 
    } 
</style> 
<script src="jquery.js" type="text/javascript"></script> 
<script src="jquery.ui.draggable.js" type="text/javascript"></script> 
<!-- Core files --> 
<script src="jquery.alerts.js" type="text/javascript"></script> 
<link href="jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" /> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     var id = $("<%# GridView1.ClientID %> tr").find('#btnDelete.ClientID'); 
     $("#btn").click(function() { 
      jConfirm('Are you sure you want to delete?', 'Confirmation Dialog', function (r) { 
       if (r == true) { 
        __doPostBack(id, ""); 
       } 
       else 
        return false; 
      }); 
     }); 
    }); 
    </script> 
    </head> 

を次のようにレコードフォームGridviewを削除しようとしたときにjqueryの警告を発射することができません。私の

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" CellPadding="4" 
     ForeColor="#333333" OnRowEditing="GridView1_RowEditing" OnRowCancelingEdit="GridView1_RowCancelingEdit" 
     OnRowUpdating="GridView1_RowUpdating" OnRowDeleting="GridView1_RowDeleting" Width="574px"> 
     <RowStyle BackColor="#EFF3FB" /> 
     <Columns> 
      <asp:TemplateField HeaderText="ID"> 
       <ItemTemplate> 
        <asp:Label ID="Id" runat="server" Text='<%#Eval("ID") %>'></asp:Label> 
       </ItemTemplate> 
       <EditItemTemplate> 
        <asp:Label ID="eid" runat="server" Text='<%#Eval("ID") %>'></asp:Label> 
       </EditItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Name"> 
       <ItemTemplate> 
        <asp:Label ID="Name" runat="server" Text='<%#Eval("Name") %>'></asp:Label> 
       </ItemTemplate> 
       <EditItemTemplate> 
        <asp:TextBox ID="ename" runat="server" Text='<%#Eval("Name") %>'></asp:TextBox> 
       </EditItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Address"> 
       <ItemTemplate> 
        <asp:Label ID="Address" runat="server" Text='<%#Eval("Address") %>'></asp:Label> 
       </ItemTemplate> 
       <EditItemTemplate> 
        <asp:TextBox ID="eprice" runat="server" Text='<%#Eval("Address") %>'></asp:TextBox> 
       </EditItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText=""> 
    <ItemTemplate> 
        <asp:LinkButton ID="edit" runat="server" Text="Edit" CommandName="edit"></asp:LinkButton> 
        <input id="btn" type="button" value="Delete" class="submit_12" /> 
        <asp:LinkButton ID="btnDelete" runat="server" Visible="false" Text="Delete" CommandName="Delete" /> 
       </ItemTemplate>     <EditItemTemplate> 
        <asp:LinkButton ID="update" runat="server" Text="Update" CommandName="update"></asp:LinkButton> 
        <asp:LinkButton ID="cancel" runat="server" Text="Cancel" CommandName="cancel"></asp:LinkButton> 
       </EditItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
     <FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> 
     <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" /> 
     <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" /> 
     <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" /> 
     <EditRowStyle BackColor="#2461BF" /> 
     <AlternatingRowStyle BackColor="White" /> 
    </asp:GridView> 

を次のようにGridViewですしかし、私は必要な警報を得ることができません誰かが私が間違っていたどこに伝えることができます

私はこのサイトからのアラートを使用しています

http://labs.abeautifulsite.net/archived/jquery-alerts/demo/

スクリプトは、おそらくjQueryの登録を持っていない

enter image description here

+2

ブラウザにエラーが発生しましたか? –

+0

'var id ='はnullではありませんか? – sll

+0

はい私の編集内容を確認してください。 – Dotnet

答えて

4

を追加した問題を、すべての必要なスクリプトを追加しましたが、それでも同じあなたのページに

を見てみましょう:ページJQqueryを含める方法を確認するために http://docs.jquery.com/How_jQuery_Works#jQuery:_The_Basics

+0

私はすでに必要なスクリプトのチェックを一度追加しました – Dotnet

+0

はSantaのように常に2回チェックします^^ –

+0

ChromeからDeveloper Tools NetworkタブまたはFirebugネットワークタブのようなものを使用して、jsファイルが実際にサーバーから受信されているかどうかを確認します。 –

4

上記のコードがページ上にあるすべてのものである場合、jQueryライブラリへの参照がありません。

jquery.alert.jsは、メインのjQueryライブラリのプラグインであるため、最初にそれを参照してから、アラートプラグインを参照する必要があります。

<script src="[path-to-jquery-library]" type="text/javascript"></script> 
<script src="jquery.alerts.js" type="text/javascript"></script> 
<link href="jquery.alerts.css" rel="stylesheet" type="text/css" media="screen" /> 

また、このプラグインを使用するために必要なjqueryライブラリの最小バージョンが何であるかを再確認してください。

編集 コードを更新した後、私は間違った順序でjavascript参照があることがわかります。上記の注文をご覧ください。

+0

まだ同じ問題 'Tim B James' – Dotnet

+0

まずはjquery.jsがあり、次にjquery.alerts.jsがありますか?同じエラー? –

+0

私は投稿したリンクの通りにスクリプトをペーストしました – Dotnet

1

すべての削除ボタンにClickイベントを割り当てようとしているとしますか?しかし、あなたのjQueryセレクタは、ID "btnDelete"を持つ単一の要素を探していることを示しています。いずれの場合でも、.NETはコントロール階層に基づいてIDを割り当てるため、GridViewボタンのIDはもっと長くなります。それはおそらくより多くのようなものです:

GridView1 $ ROW1 $ btnDelete

GridView1 $ ROW2 $ btnDelete

など

あなたは、正確な名前を取得するには、ページのソースを表示することができますが、あなたのセレクタがあります間違っている(あなたが1つのボタンを選択していても)。あなたのbtnDeleteに独特のCssClassを追加します。

<asp:LinkButton ID="btnDelete" runat="server" Visible="false" Text="Delete" CommandName="Delete" CssClass="promptDelete" /> 

(これのCssClassがあなたの内に存在する必要はないことに注意してください。cssファイル) セレクタを次のように変更してください。

$(".promptDelete").click(function() { 
    jConfirm('Are you sure you want to delete?', 'Confirmation Dialog', function (r) { 
     if (r == true) { 
      __doPostBack(id, ""); 
     } 
     else 
      return false; 
    }); 
}); 
+0

こんにちは 'mgoonan'は、jqueryのすべてのリンクボタンを見つけることが可能です。 – Dotnet

+1

これらをリンクする最良の方法は、クラス属性を使用することです。しかし、これはあなたのエラーがjqueryファイルがないことを示唆しているように、別のエラーを生成していました –

関連する問題