ansaurus

Question

Dynamically disable jQuery Datepicker Icon

Answer 1

A:

Ok, I'm not sure if I understood you right, but you want to show the same image for the datepicker but that image can't be clickable right?

So instead of doing this:

$(".textWithDatePicker").datepicker.....

You should do something like this:

$(".textWithoutDatePicker").after("<img src='datePickerImage.png' />");

To help you out, it would be better if your text box had a class identifying which behavior you are intending for that textbox.

VinTem 2010-02-24 02:39:53

Answer 2

A:

I quite like kelvin Luck's date picker, I recently changed to it from the one in jQueryUI

http://www.kelvinluck.com/projects/jquery-date-picker/

Dan Lord 2010-02-24 02:45:27

Answer 3

+1 A:

Hi

Well if your using the jquery U.I datepicker why not use the built in disable command? So on post back you just disable it.

Of course the textbox will be disabled as well but I am assuming that's what you want too.

// jquery ui has a built in icon that shows up automatically http://jqueryui.com/demos/datepicker/#icon-trigger

// how to disable jquery ui. http://jqueryui.com/demos/datepicker/#method-disable

Here is how to disable the box once a post back happens. I am not clear if you want this to happen right after they enter something in the textbox or not though.

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;

<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head runat="server">
    <title></title>
    <link href="ui.all.css" rel="stylesheet" type="text/css" />
        <link href="ui.core.css" rel="stylesheet" type="text/css" />
    <link href="ui.datepicker.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"&gt;&lt;/script&gt;


    <script type="text/javascript">
        $(function()
        {

            $("#txtMyTextBox").datepicker({ showOn: 'button', buttonImage: 'images/calendar.gif', buttonImageOnly: true });
            var disabled = $('#txtMyTextBox').attr('disabled');
            if (disabled == true)
            {
                $("#txtMyTextBox").datepicker('disable');
            }
            else
            {
                $("#txtMyTextBox").datepicker('enable');
            }


        });


</script>



</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:TextBox ID="txtMyTextBox" runat="server" Enabled="false"></asp:TextBox>
        <asp:Button ID="enable" runat="server" Text="enable" onclick="enable_Click" 
            style="width: 56px" />
        <asp:Button ID="disable" runat="server" Text="disable" 
            onclick="disable_Click" />

    </div>

    </form>
</body>
</html>

code behind

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class _Default : System.Web.UI.Page 
{


    protected void enable_Click(object sender, EventArgs e)
    {
        txtMyTextBox.Enabled = true;
    }
    protected void disable_Click(object sender, EventArgs e)
    {
        txtMyTextBox.Enabled = false;
    }
}

chobo2 2010-02-24 02:45:39

That's exactly the kind of behavior I was looking for.I've already looked into the disable methods. Sorry, should've been more specific. I don't know how to call the jQuery disable method from the code-behind so that it gets disabled on postback.

Jonn 2010-02-24 03:14:30

Please see my edit

chobo2 2010-02-24 04:06:45

Thanks! This is exactly what I was looking for.

Jonn 2010-02-24 05:15:06

ansaurus

tags:

views:

answers:

Dynamically disable jQuery Datepicker Icon

related questions