[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1380
  • Last Modified:

Calendar Selection Changed

Hi Guys,


I am designing a calendar control and I want to achieve that whenever user clicks on date it should open up a modal window that would display data corresponding to that date.  So I would need to add the selected date to the query string of the modal window.

I have tried to do it, but it does'nt seems to work in correct way.

Code
--
Private Sub Calendar1_SelectionChanged(ByVal sender As Object, ByVal e As System.EventArgs) Handles Calendar1.SelectionChanged
  Calendar1.Attributes.Add("onclick", "javascript:window.showModalDialog('Daydescription.aspx?@cid=" + Trim(DropDownList1.SelectedValue) + "&@ctext=" + Trim(DropDownList1.SelectedItem.Text) + "&@dday=" + Trim(Calendar1.SelectedDate) + "');")

    End Sub

Can nyone help to resolve this issue.

Any help will be very much appreciated.

0
radhakrishan
Asked:
radhakrishan
  • 7
  • 3
1 Solution
 
TheMegaLoserCommented:
Can you describe whats happening?

Here's the reason why I think it's not working at the momeny.

1) You create the calendar control and tthe users views it
2) He/she clicks on a date¨
3) The page is sent back to your server
4) You crate the correct link for the date

Ie, when the user clicks on a date the first time it will not open a window since the javascript to open the window isnt there. It's get added after the postback. What you need to do is add all the javascript at stage 1.

Atm, it probably it works if you click the same date a second time?


0
 
radhakrishanAuthor Commented:
You are very right there that it does not work on first time but yes works on second run.

What I want is that it works on 1st run whenever user clicks any date the modal window is shown.


Is there any way round this problem?

Cheers.
0
 
radhakrishanAuthor Commented:
What I have tried to do is to add the following code  when the user visits the page first time.

  If Not (Page.IsPostBack) Then

            Calendar1.SelectedDate = DateTime.Now

          Calendar1.Attributes.Add("onclick", "Cal()")

            Calendar1.Attributes.Add("onclick", "javascript:window.showModalDialog('Daydescription.aspx?@cid=" + Trim(DropDownList1.SelectedValue) +                  "&@ctext=" + Trim(DropDownList1.SelectedItem.Text) + "&@dday=" + Trim(Calendar1.SelectedDate) + "'); Cal()")
             End If

1. On the first visit to the page the current date should be the selected date.

2. The user should be able to click on any part of the cell. and it fires the Cal() function.

      function Cal()
            {
                    Form1.Hidden1.value = "true";
                  Form1.submit();
            }
This submits the form so that :
  If Hidden1.Value = "true" Then
            Calendar1_SelectionChanged(Nothing, Nothing)
        End If

This code is executed.

--This above code lets me click the complete cell then just the date.

The trouble is when I click on the form it submits the form but it does not change the selected date.
And it should first submit the form and then open the modal window with the right parameter.

Any help appreciated.
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
sukumar_diyaCommented:
As i mentioned in your another question try this...

RadhaKrishnan,

Add the following code in ur head section of the HTML and call the function AddCalendarCellEvents in your page load(javascript).

Don't forget to change the calendar ctrl id in the function..

<script language=javascript>
          function AddCalendarCellEvents()
          {
               var cal = document.getElementById("Calendar1");// Change the calendar ctrl id
              for(icount=2;icount<cal.children[0].children.length-1;icount++)
              {
                    var TR = cal.children[0].children[icount];
                    for(jcount=0;jcount<TR.children.length - 1;jcount++)
                    {
                         var cell = TR.children[jcount];
                         var link = cell.children[0];
                         eval("cell.onclick = function(){" + link.href.replace("javascript:","") + ";}");
                    }
              }
          }
          </script>

Hope  this helps you,
Suku
0
 
radhakrishanAuthor Commented:
Hi Suku,

The solution you have given here,
you said I should call this in page load event..
But how will it be called by adding attribute to Calendar or is there some other way of calling this function?

Thnx v much for ur help!
0
 
radhakrishanAuthor Commented:
I have added following code in PageLoad


            Calendar1.Attributes.Add("onclick", "AddCalendarCellEvents()")

But it does'nt work the way it should I would have to click twice to get the date selected.
And also does the CalendarSelection mode still remains = Day.


--Nitin
0
 
sukumar_diyaCommented:
no don't add it to the control add it to the body tag in the HTML like

<Body onload="AddCalendarCellEvents();">
.....
....
....
</body>

Suku
0
 
radhakrishanAuthor Commented:
Hi Suku,

That works perfect, so first thanks for that.

I have another question related to this problem: (So I have increased the pts to this question)

When the user clicks any date I have to open another window which shall take that date as input and do some processing...

Wat is the best way to solve this problem,
as If I add an attribute to calendar onclick it comes up with the last date I clicked on the calendar and not the current date, which is not right.

Hope u can give me some hint to solve this problem.
I m very new to .NET Programming.
0
 
radhakrishanAuthor Commented:
Hi Suku,

Havin tested that functionality, the click does not work on every day.
Like: It does not work on any Sunday's and on another month dates I have to double click to achieve that.

Is there any reason why thats happeneing?
0
 
sukumar_diyaCommented:
Sorry Nitin, there is a bug in my function..

Please try the following one and tell me ..(And change the Calendar control id )

function AddCalendarCellEvents()
            {
                  var cal = document.getElementById("Calendar1");
                for(icount=2;icount<cal.children[0].children.length;icount++)
                {
                        var TR = cal.children[0].children[icount];
                        for(jcount=0;jcount<TR.children.length ;jcount++)
                        {
                              var cell = TR.children[jcount];
                              var link = cell.children[0];
                              eval("cell.onclick = function(){" + link.href.replace("javascript:","") + ";}");
                        }
                }
            }

Thanks,
Suku
0
 
radhakrishanAuthor Commented:
Hi Suku,


It works perfect.

Your great expert in .NET.

Many thanks,
Nitin
0

Featured Post

Important Lessons on Recovering from Petya

In their most recent webinar, Skyport Systems explores ways to isolate and protect critical databases to keep the core of your company safe from harm.

  • 7
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now