Error message when modal is empty

I have a couple of modal popups on my page that hold checkboxes. The checkboxes are different items that can be added to a specific product. Some products, however, have all of one type of item assigned to them. I need a way to show a message in the modal when the modal is empty.

I have tried using a Label inside the modal that says "All features are currently associated with this product." But the label leaves a space in the modal when it's visibility is set to hidden and that was annoying so I ditched that idea.

What is a good way to have a hidden message that shows up when the modal is empty?

<asp:LinkButton ID="FeatureButton" runat="server">Feature</asp:LinkButton>
  <asp:Panel ID="FeaturePanel" runat="server" CssClass="modalPopup"
  Style="display:none">
     <div class="PopupHeader">Add a Feature</div>
       <asp:CheckBoxList ID="cbxAddFeature" runat="server" 
       DataSourceID="dsNewFeatures" DataTextField="FeatureTitle"
       DataValueField="FeatureID"></asp:CheckBoxList>
       **<asp:Label ID="FeatureError" runat="server" 
       Text="All features are currently associated to this product." 
       Display="none"></asp:Label>**
         <asp:Button ID="SubmitFeatures" runat="server" Text="Submit" />
         <asp:Button ID="CancelSubmitFeatures" runat="server" Text="Cancel" />
   </asp:Panel>
<asp:ModalPopupExtender ID="FeatureModal" runat="server" 
BackgroundCssClass="modalBackground" CancelControlID="CancelSubmitFeatures"
DropShadow="True" DynamicServicePath="" Enabled="True" 
PopupControlID="FeaturePanel" TargetControlID="FeatureButton">
</asp:ModalPopupExtender>   


Protected Sub SubmitFeatures_Click(ByVal sender As Object, ByVal e As System.EventArgs)
Handles SubmitFeatures.Click
FeatureModal.Hide()
For Each feature As ListItem In cbxAddFeature.Items
**FeatureError.Visible = False**
If feature.Selected Then
'SQL INSERT: Marketing Table
Dim strSQL As String = "INSERT INTO Marketing (ProductID, MarketingTypeID, MarketingTitle, MarketingData) VALUES (@ProductID, 3, 'Feature', @MarketingData)"

Using cn As New   SqlConnection(System.Configuration.ConfigurationManager.ConnectionStrings("LocalSqlServer").ConnectionString)

Using cmd As New SqlCommand(strSQL, cn)

cmd.Parameters.Add(New SqlParameter("@ProductID", ProductID.Value))
cmd.Parameters.Add(New SqlParameter("@MarketingData", feature.Value))

cn.Open()

cmd.ExecuteNonQuery()
End Using
End Using
End If
**If (dsNewFeatures) == DBNull.Value Then
  FeatureError.Visible = True
End If**
 Next
 Response.Redirect(Request.RawUrl)
End Sub

<asp:SqlDataSource ID="dsNewFeatures" runat="server" 
    ConnectionString="<%$ ConnectionStrings:ProductsConnectionString %>" 
    ProviderName="<%$ ConnectionStrings:ProductsConnectionString.ProviderName %>" 
    SelectCommand="SELECT DISTINCT f.FeatureID, f.FeatureTitle 
    FROM Feature f LEFT JOIN Category c ON c.CategoryID = f.CategoryID 
    WHERE f.CategoryID IN 
    (SELECT CategoryID FROM CategoryLink 
    WHERE ProductID = @ProductID) AND f.FeatureID NOT IN 
    (SELECT m.MarketingData FROM Marketing m 
    WHERE m.MarketingTypeID = 3 AND m.ProductID = @ProductID) 
    ORDER BY f.FeatureTitle">
    <SelectParameters>
        <asp:QueryStringParameter Name="ProductID" QueryStringField="id" />
    </SelectParameters>
    <SelectParameters>
        <asp:QueryStringParameter Name="CategoryID" QueryStringField="id" />
    </SelectParameters>
</asp:SqlDataSource>

All **** items are pieces of the label, the If, End If statement doesn't work, does anyone know how I can change that to get it to find an empty modal for the error message?

This is what it looks like now, notice the label showing. I don't know why it won't go away!

EDIT 9/29/11

Protected Sub dsNewFeatures_Selected(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.SqlDataSourceStatusEventArgs) Handles dsNewFeatures.Selected
    If FeatureError.Text = String.Format("rows count: {0}", e.AffectedRows) Then
        FeatureError.Visible = True
    Else
        FeatureError.Visible = False
    End If
End Sub

It almost works! The label is not visible just based 开发者_运维知识库off of this code, but I can't get it to unhide when I empty the modal

When you say it's visibility is set to hidden you refer to the CSS visibility property? If so, try using display:none instead and that should fix the spacing issue that you dislike.

If that doesn't do it (I think it will), simply set the Visible property of the label to false in code behind when you trigger the event that pops up the dialog. I believe ASP.NET doesn't render elements when the Visible property is false so this definitely should work.

What I mean is this:

annoyingLabel.Visisble=False

You can toggle the Visible property accordingly depending on whether you need to display the message or not.

Hope this helps.

UPDATE:

How about this?

Dim showNextTime As Boolean = False
If feature.Selected Then
  '' your code here
Else 
   showNextTime =True 
End If

FeatureError.Visible = showNextTime

Since you are iterating through all items and checking whether they are selected or not all you need to do is set a flag that will become true the moment one of the items is not selected (meaning, there will be at least one item left to be added).

If there are no items to go through, then by default FeatureError.Visible should be false.

Does that work for you?

UPDATE 2

Dim showNextTime As Boolean = False
If feature.Selected Then
  '' your code here
Else 
   showNextTime =True 
End If
' Add this condition to make it visible if Items.Count==0 
FeatureError.Visible = (showNextTime Or cbxAddFeature.Items.Count==0)

UPDATE 3 Now try this:

Add an OnCLick event to your FeatureButton as so:

<asp:LinkButton OnClick="FeatureButton_Click" ID="FeatureButton" runat="server">Feature</asp:LinkButton>

And on your code Behind:

  Sub FeatureButton_Click(sender As Object, e As EventArgs) 
     FeatureError.Visible = (cbxAddFeature.Items.Count=0)
  End Sub

We will make this work.

UPDATE 4: Change your OnSelected code to this (I don't know why were you comparing text):

Protected Sub dsNewFeatures_Selected(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.SqlDataSourceStatusEventArgs) Handles dsNewFeatures.Selected
    If  e.AffectedRows=0 Then
        FeatureError.Visible = True
        FeatureError.Text= "All features are currently associated to this product." 
    Else
        FeatureError.Text= "" 
        FeatureError.Visible = False
    End If
End Sub

You're getting white space because of how asp.net controls visibility behind the scenes. When the control is rendered to the browser it's css style is set to visibility: hidden which will leave white space in the document where the element should be. If you want to remove the white space then you must use the css style display: none.

So, in your code: Change

<asp:Label ID="FeatureError" runat="server" 
       Text="All features are currently associated to this product." 
       Display="none"></asp:Label>

To

<asp:Label ID="FeatureError" runat="server" 
       Text="All features are currently associated to this product."></asp:Label>

Change

For Each feature As ListItem In cbxAddFeature.Items
**FeatureError.Visible = False**
....

To

 For Each feature As ListItem In cbxAddFeature.Items
    FeatureError.Attributes.Add("Style", "Display: None;")
...

Change

**If (dsNewFeatures) == DBNull.Value Then
  FeatureError.Visible = True
End If**

To

Dim dv as DataView
dv = CType(dsNewFeatures.Select(DataSourceSelectArguments.Empty), DataView)
If(dv.Count == 0)
  FeatureError.Attributes("Style") = "Display: Inline;"
End If

You could also refactor the styles to be in a stylesheet if you wanted.

Reference: Visibility vs Display in CSS