Visible the Textbox when User Select Others on the Dropdownlist using Javascript

Posted by Venkat | Labels: ,

Hi i have came across one task, ie: I have dropdownlist that has some items along with 'Others' So if the user Choose the value Others -  i have to visible the Textbox and Validator so user should enter somthing on the textbox else it show Validation error if the user choose any other item , i have to disable the Textbox and the Validator.

Using Javascript its easy to do this , i am not good in Javascript i got a help from the Expert to make it work.

ASPX

<asp:DropDownList ID="EducationLevel_DropDownList" runat="server" Width="202px"
                                            Font-Names="Verdana" Font-Size="10pt" AppendDataBoundItems="True">
                                            <asp:ListItem Value="-1">Select</asp:ListItem>
                                            <asp:ListItem Value="1">PhD</asp:ListItem>
                                            <asp:ListItem Value="2">PhD Student</asp:ListItem>
                                            <asp:ListItem Value="3">Master Degree</asp:ListItem>
                                            <asp:ListItem Value="4">Bachelor Degree</asp:ListItem>
                                            <asp:ListItem Value="5">Under Graduate Student</asp:ListItem>
                                            <asp:ListItem Value="6">Others</asp:ListItem>
                                        </asp:DropDownList>
                                        <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="EducationLevel_DropDownList"
                                            Display="Dynamic" ErrorMessage="Education Leve required !" InitialValue="-1"
                                            SetFocusOnError="True" ValidationGroup="Profile" Font-Size="8pt">*</asp:RequiredFieldValidator><asp:TextBox ID="TextBox1"
                                                runat="server"></asp:TextBox> <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
                                            Display="Dynamic" ErrorMessage="Education Leve required !" 
                                            SetFocusOnError="True" ValidationGroup="Profile" Font-Size="8pt">*</asp:RequiredFieldValidator>

And the Javascript is given below so here i am pass the Valuefield of Other ie: 6 , when a textbox has validators, they are stored in the Validators collection , so no need to pass the ValidatorID.


JAVASCRIPT


<script type="text/javascript" language ="javascript" >


function getSelectValue(sel) {
   
    var val;
    // only if there is a selected item
    if (sel.selectedIndex>-1) {
        // get the value from the select element
        val=sel.options[sel.selectedIndex].value;
       // alert(val);
    }
   
    return val;
}


        function ddlChange(DropDownID,TextBoxID)
        {
            var c=document.getElementById(DropDownID);
            var div=document.getElementById(TextBoxID);
            if(getSelectValue(c)=='6')
            {
                div.value='';
                div.style.visibility="visible";
                if (div.Validators&&div.Validators.length) {
                   for (var i=0; i<div.Validators.length; i++)
                       ValidatorEnable(div.Validators[i], true)
                }
            }
            else
            {
                div.value='6';
                div.style.visibility="hidden";
                if (div.Validators&&div.Validators.length) {
                   for (var i=0; i<div.Validators.length; i++)
                       ValidatorEnable(div.Validators[i], false)
                }
            }
        }
    </script>

Then On_PageLoad you have to pass the TextboxID and DropdownlistID to the Javascript Function.


EducationLevel_DropDownList.Attributes.Add("onchange", "ddlChange('" + EducationLevel_DropDownList.ClientID + "','" + TextBox1.ClientID + "');");
        TextBox1.Style.Add("visibility", "hidden");

Bind Images from Folder to Datalist

Posted by Venkat | Labels: ,

Here we are going to see how to bind the images from the folder to Datalist. I am storing the images on Server Folder , so i have to show what are the images available on the Folder it may be .png,.jpg or any ...

ASPX

<asp:DataList ID="DataList1" runat="server" RepeatColumns="5" CellPadding="5">
            <ItemTemplate>
            <asp:Image Width="100" ID="Image1" ImageUrl='<%# Bind("Name", "~/images/{0}") %>' runat="server" />
                <br />
                <asp:HyperLink ID="HyperLink1" Text='<%# Bind("Name") %>' NavigateUrl='<%# Bind("Name", "~/images/{0}") %>' runat="server"/>
            </ItemTemplate>
                <ItemStyle BorderColor="Silver" BorderStyle="Dotted" BorderWidth="1px" HorizontalAlign="Center"
                    VerticalAlign="Bottom" />
</asp:DataList> 

see here, we get the files from the folder using System.IO Namesapce  , then i am checking the images on the folder ie: checking the extension that i am going to allow - to show it on Datalist. you can include the Extension whatever you want so that is going to add it on arrayList, then pass the array list to DataSource of the Datalist.


Code-Behind

protected void Page_Load(object sender, EventArgs e)
    {
        ListImages();
    }

    private void ListImages()
    {
        DirectoryInfo dir = new DirectoryInfo(MapPath("~/images"));
        FileInfo[] file = dir.GetFiles();
        ArrayList list = new ArrayList();
        foreach (FileInfo file2 in file)
        {
            if (file2.Extension == ".jpg" || file2.Extension == ".jpeg" || file2.Extension == ".gif")
            {
                list.Add(file2);
            }
        }
        DataList1.DataSource = list;
        DataList1.DataBind();
    }

PayOffers.in