jimfog

I will try to be more specific...go to this fiddle here:http://jsfiddle.net/fiddlehunt/5xsxP/ Go to weekview of the calendar.When you click a time slot a popup appears with the times selected depicted in the dropdown menu. Now,the option values of the dropdown menus are not timestamps (just look the HTML window). How am I going to create timestamps that are dependent on the timeslots selected,taking into consideration also the day/month? Is there a js method that can help me achieve that? In PHP for example,if I recall correctly strtotime is used to covert textual datetime textual description into a UNIX timestamp. Is there anything similar in JS? Is there any other alternative worth examining? Do you understand now what I am trying to achieve?

As I see it a must make a function that dynamically will populated the option values with the corresponding time stamps The bottom line....do you have any idea how I could start this? A representative piece of code maybe.

I will consider what you say,it makes sense.Nonetheless,I do not know if it is the optimum solution for my case. Anyway, I will do what you suggest. Given the fact that each option must correspond to a different timestamp (and these must correspond to a specifc day/month) it will not be easy to do it,since I have to "tie" the logic with the one supplied by the jquery fullcalendar plugin http://arshaw.com/fullcalendar/

I have made a dropdown menu where the options are times(in string format)...like this: http://jsfiddle.net/fiddlehunt/5WVKz/ How am I going to test if the user selected a value bigger than 10:00? Since we are talking about strings here I do not think the inequality operators will do any good-I tried it anyway. O do not know what I could do in a case such as this.

sorry... here is the correct link. http://jsfiddle.net/fiddlehunt/Y7Wh5/

In this fiddle I have a calendar where upon clicking a timeslot a dialog box appears where the user can enter title and choose times from 2 dropdown menus: http://jsfiddle.net/fiddlehunt/ZVxuL/ My question is why when I go for the first time to click a time slot the dialog box does not appear-you can reload the page and see what I am talking about. The console does give an indication of errors...so I can have a basis for investigating. What do you think?

Did you go to weekview? See these two images: This show where should you place the cursor http://1drv.ms/1jtgU4A...for the dialog to appear. And here is the dialog that appears so you can know what to expect. http://1drv.ms/1c1AC6x

Go and see this fiddle http://jsfiddle.net/fiddlehunt/ZVxuL/ .It uses $this as you proposed.There are some issues to mention. I am going to refer only to one now. Go to the select function....in the js code. My problem is the following: If you click a cell in the calendar(in weekview, forget month view for now...) a dialog box appear with the time selected depicted in the dropdown menus. The cell is comprised of this html: <div class="fc-event-inner"><div class="fc-event-time">4:00 - 4:30</div><div class="fc-event-title"></div></div> The problem is that when clicking the cell I must specifically target the fc-event-time div element(as the js code demonstrates) or else the dialog box does not appear-when targeting for example with the mouse cursor fc-event-inner. How can I fix this and still retain $this(as it solves the problem I mention above) in my code? You must see with your eyes the problem to understand what I mean. Just go the fiddle.

I am preparing a fiddle to demonstrate the problem.... There is one small issue though....in order to demonstrate the problem I need this plugin here https://github.com/patrickkunka/easydropdown js fiddler-when working with external files/resources,these must be placed in a CDN....the js file that is required for the above plugin to work is not located in any cdn. What can I do in such a case? This is the file here....https://github.com/patrickkunka/easydropdown/tree/master/src How can I add it to fiddle?

Well... the reason for my last post(regarding this) is the following: With this code I am trying to set the value of 2 dropdown menus-the one is the start of the event and the other is the end-combine: $('#timesfrom').easyDropDown('select',tslotfrom); $('#timesfor').easyDropDown('select',tsloto);//the tslotfrom/tsloto variables are "taken" (by using string methods) from the timeslot selected in the calendar Here is an image example of a timeslot: http://1drv.ms/1qDuXd3...in this example tslotfrom=5:00 and tslotto=5:30 The problem appears when I select more than half an hour: http://1drv.ms/1lfT22y ...while tslotto ought to be equal to 6 it remains 5:30. Probably I should give more code but I do not want to overwhelm you and see if we can find a solution with the facts given so far. It is a matter of correct js coding I believe.

Suppose my code is not enclosed in a function...meaning like this: var timeslot=$('.fc-event-time').html().slice(0,2).replace(":","");//this separates the hours from the minutesif(timeslot>=10)//no need to know what this conditional does for the moment{var tslot=$('.fc-event-time').html().slice(0,5).replace(":","");}else{var tslot=$('.fc-event-time').html().slice(0,4).replace(":","");}$('#times').easyDropDown('select',tslot); //this sets the value at the dropdown menu...easyDropDown is a jquery plugin How am I going to use $this in the above code? I am saying that cause I am having some problems if the above code is contained in a function...as it is depicted in my first post

I cannot believe it was so simple...thanks. I have to proceed now and fully test the code...so I might post again if it is necessary.

I am going to state my problem in simpler terms. Take a look at this fiddle: http://jsfiddle.net/fiddlehunt/9wFeX/8/ Two timeslots are depicted...both are different and both are contained in classes with the same name. Is there a way when clicking each class(as shown by the js code) the different HTML content is shown-since we are dealing here with 2 different timeslots. As the code is now it is impossible-the code you see though is of a plugin(see my first post),it is not mine and it would be difficult to hack it. Is there a trick I could do? Anyway here is the function that prints the timeslots in the calendar...go to line 3962: http://1drv.ms/1ke2gfe

I will prepare a fiddle example.

I am building a calendar based on this plugin http://arshaw.com/fullcalendar/I have added a feature where upon selecting a timeslot a popup window appears with a dropdown menu where the time selected will appear therejust like outlook.com calendar.I have managed the above by "taking" the HTML segment(which contains the time in numeric format,,,13:00 for example) of the time slot clicked and "transferring" that to the drop down menu-by selecting a specific value in it.And here is my problem:Every numeric value is hold in this element HTML Code: <div class="fc-event-inner"><div class="fc-event-time">13:00 - 14:00 </div></div> So, I target fc-event-time to get the time-13:00-14:00 here.The issue is that when I go to click another timeslot(and subsequently for the popup window to appear) the time that is "grabbed" is of a timeslot already presentin the calendar....and that because all timeslots have the same class/element you see above.What can I do in such a case?Anyway here is the js code: Code:$('#calendar').on('mouseup', '.fc-event-inner', function () {var timeslot=$('.fc-event-time').html().slice(0,2).replace(":","");//this separates the hours from the minutesif(timeslot>=10)//no need to know what this conditional does for the moment{var tslot=$('.fc-event-time').html().slice(0,5).replace(":","");}else{var tslot=$('.fc-event-time').html().slice(0,4).replace(":","");}$('#times').easyDropDown('select',tslot); //this sets the value at the dropdown menu...easyDropDown is a jquery plugin});

hm...in the rush I did not saw the whole code above...sorry. But... I am going to go one step further. Despite your code being OK I do not know if it helps achieve my broader goals...If it does not this will not be your fault but mine which did not described correctly the nature of the problem...so: here is the html: <span class="fc-button fc-button-agendaWeek fc-state-default fc-state-active" unselectable="on">week</span><span class="fc-button fc-button-agendaDay fc-state-default fc-corner-right" unselectable="on">day</span> The issue is this: Where fc-state-active appears...in the span element related to week or to the span element related to day. I think a conditional will solve the issue here....but I wanted to hear your opinion too. It is just a matter of combining all the things together now properly.

As I said again I need to detect the presence of fc-state-active...since this will not be always there. That is the problem

Probably here is the cause of the problem....span.classname prints that: fc-button fc-button-agendaWeek fc-state-default fc-state-active" So a code like this: if(span.className==='fc-state-active'){alert('test');} would not work cause there are other classes present too in the specific element. Your thought though to check what span.className prints was correct-the result did not surprised me though. So, the problem remains-finding if the specific class is indeed there.What can be done? Use a string method to find if it is there? A regular expression?

This is what I did,it ought to work but it did not: var span = document.getElementsByTagName("span")[8];span;<span class=​"fc-button fc-button-agendaWeek fc-state-default fc-state-active" unselectable=​"on">​εβδομάδα​</span>​if (span.className === "fc-state-active") { alert('week is asctive');}else{alert('week is not active');}undefined The code above is printed in the console. First I target a specific span element and then use a conditional to check is "fc-state-active" class is present in the span element-which in this case it is. Despite that, I get undefined in the console. Beyond that, I do not know what else to try.

Τhis is the code(a test version): var elements = document.getElementsByClassName('fc-button-agendaWeek');if (elements.className === "fc-state-active") {alert('test');}else {alert('no test')}; I get "no test". It does not make sense though,cause in the HTML the fc-state-active class is present.

I am afraid that what you suggest requires selecting the element first. In my case there are many span elements not just one and none of them has an ID attached to it...only classes are found. Sorry,,,but I am little confused.There must be a workaround to it. Or if the element could be the class itself...I just had this thought.

I have this html here-a span element: <span class="fc-button fc-button-agendaWeek fc-state-default fc-state-active" unselectable="on">week</span> It is HTML related to the week button of a calendar.When the calendar is on week view the above HTML is seen. Otherwise: <span class="fc-button fc-button-agendaWeek fc-state-default" unselectable="on">week</span> More specifically the fc-state-active class is absent. The question is how am I going to verify that the fc-state-active class is indeed there-as an indication that week view is indeed active-shown in the calendar.

Anyway...this is the plugin http://arshaw.com/fullcalendar/ and this is the file where modifications must be done https://onedrive.live.com/?cid=BE27434B2AAC8130&id=BE27434B2AAC8130%21321 It has nothing to do with jquery.

Well the problem in my case is that the code is found in a plugin(I mean is not my code) and I am trying to find a way to mess things as little as possible.

Globals are bad...we know that. But if I want to make available to a function the variable from another function what can I do. Is the answer to use this variable as an argument? Is there any other way?