The server tag is not well formed. html runat="server" and data-target="#<% Eval("Abbreviation")%>"

Question

I have to generate checkboxes, which i have to check when a button is clicked. When the checkbox is clicked it needs to use the "data-target" to uncollapse some code.

I need both the collapse and getting if its checked.

Problems: the runat="server" and data-targer="#<%# Eval("Abbreviation")%>" gets my compiler saying "The server tag is not well formed".

When i try to get the "chk.checked" on serveside it says it doesn't know it since i can't have runat="server" if i have the data-target.

Here is the html code for the repeater.

<asp:Repeater ID="ferryRepeater" runat="server">
            <ItemTemplate>
                <div id="div1" runat="server">
                    <input  id="chkFerry"  type="checkbox" data-toggle="collapse" runat="server" data-target="#<%# Eval("Abbreviation")%>"  />
                    <!--data-target="#<%# Eval("Abbreviation")%>" -->
                    <label id="label1" for="chk1"><%# Eval("SubcontractorName") %></label>
                    <div id="<%# Eval("Abbreviation") %>" class="collapse obligatorisk">
                        <dl>
                            <dt id="toFrom1"></dt>
                            <dd>
                                <p id="text1"><%# Eval("DialogueText") %></p>
                            </dd>
                        </dl>
                    </div>
                </div>
            </ItemTemplate>
        </asp:Repeater>

Here is the backend code for checking the checkboxes.

private List<string> CheckFerryCheckbox()
{
    List<string> ferryList = new List<string>();
    foreach (RepeaterItem item in ferryRepeater.Items)
    {
        CheckBox chk = (CheckBox)item.FindControl("chkFerry");
        if (chk.Checked)
        {
            Label ferry = (Label)item.FindControl("label1");
            ferryList.Add(ferry.Text);
        }
    }

    return ferryList;
}

Here is where i Binding with the repeater.

private void BindRepeaterData()
{
    string sqlString = @"SELECT sc.SubcontractorName, dt.DialogueText, sc.Abbreviation FROM dbo.Subcontractor sc LEFT OUTER JOIN dbo.DialogueText dt ON sc.DialogueId = dt.DialogueId WHERE sc.Active = 1 AND sc.Type = 'Færge' ORDER BY sc.SubcontractorName";
    SqlCommand cmd = new SqlCommand(sqlString, conn);
    DataSet ds = new DataSet();
    SqlDataAdapter da = new SqlDataAdapter(cmd);
    da.Fill(ds);
    ferryRepeater.DataSource = ds;
    ferryRepeater.DataBind();
}

I have tried to change Data-target to data-target='#<%# Eval("Abbreviation")%>' and have runat="server", but then it doesn't generate the Eval.

Sorry if this is not that well explained. It is my first post here, so please be gentle.

Answer 1

Try the following: Note the use of String.Format method for data-target:

<asp:Repeater ID="ferryRepeater" runat="server">
            <ItemTemplate>
                <div id="div1" runat="server">
                    <input  id="chkFerry"  type="checkbox" data-toggle="collapse" runat="server" data-target='<%# String.Format("#{0}", Eval("Abbreviation"))%>'  />

                    <label id="label1" for="chk1"><%# Eval("SubcontractorName") %></label>
                    <div id="<%# Eval("Abbreviation") %>" class="collapse obligatorisk">
                        <dl>
                            <dt id="toFrom1"></dt>
                            <dd>
                                <p id="text1"><%# Eval("DialogueText") %></p>
                            </dd>
                        </dl>
                    </div>
                </div>
            </ItemTemplate>
        </asp:Repeater>

Answer 2

Do not use double quotes on the eval. As an example:

data-target="#<%# Eval("Abbreviation")%>"

Should be:

data-target='#<%# Eval("Abbreviation")%>'

As a whole:

<asp:Repeater ID="ferryRepeater" runat="server">
        <ItemTemplate>
            <div id='div1_<%# Eval("Abbreviation")%>' runat="server">
                <input  id='chkFerry_<%# Eval("Abbreviation")%>'  type="checkbox" data-toggle="collapse" runat="server" data-target='#<%# Eval("Abbreviation")%>'  />
                <!--data-target="#<%# Eval("Abbreviation")%>" -->
                <label id='label1_<%# Eval("Abbreviation")%>' for='chkFerry_<%# Eval("Abbreviation")%>'><%# Eval("SubcontractorName") %></label>
                <div id='<%# Eval("Abbreviation") %>' class="collapse obligatorisk">
                    <dl>
                        <dt id='toFrom1_<%# Eval("Abbreviation") %>'></dt>
                        <dd>
                            <p id='text1_<%# Eval("Abbreviation") %>'><%# Eval("DialogueText") %></p>
                        </dd>
                    </dl>
                </div>
            </div>
        </ItemTemplate>
    </asp:Repeater>