techie Posted August 5, 2013 Share Posted August 5, 2013 (edited) Trying to make the original post concise. A javascript function named ‘calShow’ below needs to be modified. The application that uses it allows users to create an adHoc report query by selecting data fields. When a new query is created using this application, the above function displays the calendaricon in front of the text boxes (4 of them) if date fields are selected. Otherwise, the calendar icon (datepicker) is hidden. The issue is that when a saved query is retrieved, the date value is pulled into the text box but the calendar icon is not display (datepicker is unavailable to change date). There is a c# method 'FillSavedReportQueryFields’' which calls ‘calShow' function (see 'calShow' code below). This function does display the datepicker, but it also erases the date value from the text boxes. I am okay with modifying 'calShowl' function to work correctly but I am also open to adding another javascript function, which will simply display the datepicker if the value is date (defined as "D"). I would appreciate any help with this Edited August 14, 2013 by techie Link to comment Share on other sites More sharing options...
justsomeguy Posted August 5, 2013 Share Posted August 5, 2013 Line 741 is the one that clears the value, if that's the only problem then you can remove that line. Link to comment Share on other sites More sharing options...
techie Posted August 5, 2013 Author Share Posted August 5, 2013 Thank you so much for your response. I tried commenting the line. It is not clearing the value but it is not displaying the datepicker either! May be I am not calling the js function during my c# event method correctly: These are the two lines I have added to 'FillReportCriteriaValues' method on the .aspx.cs page: string.script = "javascript:showCal ("+ddl.ClientID+ "," + index + "); return false;";this.ClientScript.RegisterStartupScript (UpdatePanel1.GetType(), "showCal" + index.ToString(), script); When I change the field selection in the drop-down field showing date field to something else and back to 'date' field the datepicker shows up on the page next to the text box. I would like it to show when the query fields are populated. Any further help would be appreciated. Thanks Link to comment Share on other sites More sharing options...
justsomeguy Posted August 5, 2013 Share Posted August 5, 2013 Is the showCal function the one that is supposed to add the datepicker? If that function isn't doing what you expect then I would add some debugging to it to have it print various values to the browser console so that you can see what it's doing, and why it isn't adding the datepicker when the page loads. Link to comment Share on other sites More sharing options...
techie Posted August 5, 2013 Author Share Posted August 5, 2013 (edited) Strangely, I am not seeing calShow function being called any where else in the code. So I am not sure if it is adding the datepicker. Since I am a new developer, it is a bit challenging for me to find out what this function is doing. Before the original developer left he said that he had fixed this issue by adding a new javascript function 'calShow2' and added a couple of lines of code to the 'FillReportCriteriaValues' method to call it there. He wasn't able to implement it. So now I am thinking that I need to do exactly the same. I need a javascript function which will use the 'showCal' function logic to determine if the text box field value is a date, if yes, then display the calendar icon ID img#dp0, img#dp1, img#dpl2, img#dp3 and img#dp4 in front of text boxes (#txtValue0, #txtValue1,#txtValue2,#txtValue3,#txtValue4). I am not sure how those are linked to the datepicker! I can check if needed. The line 741 in showCal function that clears the date value may be required as users might change the field selection and enter new values. Isn't adding a new javascript function as described above the easiest solution? I may be wrong. Thanks Edited August 10, 2013 by techie Link to comment Share on other sites More sharing options...
justsomeguy Posted August 5, 2013 Share Posted August 5, 2013 It's probably not necessary to add a completely different function if you're only changing a couple things about the code. To make it easier to maintain it would be better to add another parameter to the existing function to indicate whether it is running on startup or not, and do things a little differently based on that. Then you don't need to duplicate all of the code. Link to comment Share on other sites More sharing options...
techie Posted August 6, 2013 Author Share Posted August 6, 2013 I reviewed the code very closely. I found that the logic in 'showCal' is used to display the datepicker when a date field is selected while building a query. So, it makes sense to use the same function to display the datepicker when date field is populated from the saved query. However, I am at loss to figure out how to modify 'showCal' function to do that and how to call it when query data is being populated. I would appreciate further help to achieve this. Link to comment Share on other sites More sharing options...
justsomeguy Posted August 6, 2013 Share Posted August 6, 2013 I would add some debugging statements to help you figure out what the function is doing. You can use the console.log method to send anything to the browser's developer console, you can send individual values or entire objects so that you can see what the function is working with. Start with that, add console.log statements to send all of the information to the console about what variables and objects it is working with, so that you can tell if it is going inside if statements or loops or whatever. The first step is to understand exactly what that function is doing whenever you call it. If you want to call the function you can just output a script block to execute it, although I'm not sure what it expects to have passed to it. The id variable that gets passed is an object, it looks like index is an integer. It looks like the id object is a select element, because it is accessing properties for value and selectedIndex. So you could call the function like this: <script type="text/javascript"> showCal(document.getElementById('some_select_element'), 0); </script> Link to comment Share on other sites More sharing options...
techie Posted August 6, 2013 Author Share Posted August 6, 2013 Thank you so much for your guidance. I spent 3 hours this morning and took the JavaScript tutorials which I found very useful. I found the below code in Page_Load method. It seems that the scripts is being run and it works when you create and save the query: lstAllFields0.Attributes["onChange"] = "javascript:showCal(" + lstAllFields0.ClientID + ",0); return false;"; lstAllFields1.Attributes["onChange"] = "javascript:showCal(" + lstAllFields1.ClientID + ",1); return false;"; lstAllFields2.Attributes["onChange"] = "javascript:showCal(" + lstAllFields2.ClientID + ",2); return false;"; lstAllFields3.Attributes["onChange"] = "javascript:showCal(" + lstAllFields3.ClientID + ",3); return false;"; lstAllFields4.Attributes["onChange"] = "javascript:showCal(" + lstAllFields4.ClientID + ",4); return false;"; One of my coworker also told me that the lines below I have added to the FillReportCriteriaValues method is registering the script but not running it because of some .NET issue. He suggested me to Google the problems to see how to run the script during that event of populating the data into the fields: string.script = "javascript:showCal ("+ddl.ClientID+ "," + index + "); return false;";this.ClientScript.RegisterStartupScript (UpdatePanel1.GetType(), "showCal" + index.ToString(), script); I will also try console.log method to see what the 'showCal' function is doing. I will update later. Thanks Link to comment Share on other sites More sharing options...
techie Posted August 13, 2013 Author Share Posted August 13, 2013 I would like to delete this post as I have decided not to pursue this any longer. I would be implementing a totally different feature. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now