Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I have a javascript calendar control in a spring mvc application. When the user clicks on a date in the calendar control, the user is redirected to a detail page for that date. The problem is that I want to pass other parameters in the url in addition to just the date. How do I add other parameters to the url in the javascript functionality?

Here is the javascript for creating the url with only the date as a parameter:

        <script type="text/javascript">
                    $(document).ready(function() {
                        $("#dayPicker").datepicker({
                            firstDay: 1,
                            dateFormat: "yy-mm-dd",
                            defaultDate: new Date(${calendar.dayMillis}),
                            onSelect: function(dateText, instance) {
                                window.location = "${pageContext.request.contextPath}/calendar?day=" + encodeURIComponent(dateText);
                                }
                        });
                    });
        </script>  

For illustration, here is the code for generating a url including two other optional parameters (pid and eid) elsewhere in the JSP:

            <c:url var="previousLink" value="/calendar">
                <c:param name="day" value="${calendar.previousDay}" />
                <c:choose>
                    <c:when test="${pid!=null}">
                        <c:param name="pid" value="${pid}" />
                    </c:when>
                    <c:otherwise></c:otherwise>
                </c:choose>
                <c:choose>
                    <c:when test="${eid!=null}">
                        <c:param name="eid" value="${eid}"></c:param>
                    </c:when>
                    <c:otherwise>
                    </c:otherwise>
                </c:choose>
            </c:url>
            <a href="${previousLink}">Previous</a>  

How do I alter the javascript above so that it adds parameters for pid and eid if and only if either pid or eid is not null?

share|improve this question
add comment

1 Answer

This can be done by concatenating the URL parameters separated by the & character:

var url = "${pageContext.request.contextPath}/calendar?day=" + encodeURIComponent(dateText);

if (pid) {
    url += "&pid=" + encodeURIComponent(pid);
}

if (eid) {
    url += "&eid=" + encodeURIComponent(eid);
}

window.location = url;
share|improve this answer
    
+1 Thank you. But your code is adding a # sign to the end of the url so it looks like this: /calendar?day=2014-03-10&pid=1# . Is there some way to alter your code so it does not leave a # sign at the end? –  CodeMed Mar 10 at 23:21
    
Im glad I could help, the # is the bookmark sign and it can be safely ignored as it does not get sent to the server on POST/GET. Somehow encodeURIComponent seems to be adding it –  jhadesdev Mar 10 at 23:27
    
I am testing the code, and it turns out that the following two lines cause the link to never change the value of the date parameter: if (pid) {url += "&pid=" + encodeURIComponent(pid);} , if (eid) {url += "&eid=" + encodeURIComponent(eid);} . When I remove these 2 lines, the rest of your suggested code lets me change dates, but the eid and pid parameters are not added to the url. How can I fix this? –  CodeMed Mar 10 at 23:31
    
The code in my posting sets the url when a user clicks on a calendar day in the jquery datepicker tool at this link: jqueryui.com/datepicker –  CodeMed Mar 10 at 23:38
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.