jquery datapicker not working in MVC view

Why doesnt a jquery datapicker not work in an MVC view when I am looping through a set of records?

In my view I render out a list (code snippet below).

If I comment this code out then the date picker works but if I leave the code below in the date picker does not work, no error just no date picker


<% foreach (myModel.Models.Idea item in Model.ListOfStuff)
           {  %>
        <li>
            <%= Html.ActionLink(item.Title, "Details", new { id = item.Id })%>
            -
            <%= Html.ActionLink("Details","Details",new {id=item.Id}) %>
            |
            <%= Html.ActionLink("Edit", "Edit", new { id = item.Id })%></li>
        <%} %>

Open in new window

ToString1Asked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Roman GhermanSenior Software EngineerCommented:
Hmmm,
It is not clear where the datepicker is created and for what element, can you please provide more code where datepicker is created, on which elements, where the code above is positioned ?
0
ToString1Author Commented:
Looking at source of rendered view..I have copied code below
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>

    





    <script type="text/javascript">
        $(document).ready(function() {
            $("#datepicker").datepicker();
        });
    </script>


</head>

then in the body 


  <div class="aList">
        Date :
        <input type="text" id="datepicker" name="datepicker">
    </div>

Open in new window

0
Roman GhermanSenior Software EngineerCommented:
And where are the <li> elements?

You can try  closing the input tag, however I don't know for sure if this is the source of the problem

<input type="text" id="datepicker" name="datepicker" />
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Build an E-Commerce Site with Angular 5

Learn how to build an E-Commerce site with Angular 5, a JavaScript framework used by developers to build web, desktop, and mobile applications.

ToString1Author Commented:
There are no li elements on the page.

I have closed the input tag but this has made no difference
0
Roman GhermanSenior Software EngineerCommented:
<% foreach (myModel.Models.Idea item in Model.ListOfStuff)
           {  %>
        <li>
            <%= Html.ActionLink(item.Title, "Details", new { id = item.Id })%>
            -
            <%= Html.ActionLink("Details","Details",new {id=item.Id}) %>
            |
            <%= Html.ActionLink("Edit", "Edit", new { id = item.Id })%></li>
        <%} %>

Open in new window


This should be generating a list of <li> elements which you said is causing the datepicker not to appear. These are the li elements which I expect you to give to me.

Also - you gave too few details for anybody to be able to help you.
0
ToString1Author Commented:
Whoops sorry about that!

Here is the markup and I have replaced the text


    <p>
        test</p>
    <ul class="test">
       
        <li>test tes test <br/>
        </li>
       
    </ul>
    <h2>
        Search</h2>
    <p>
        Test test </p>
    <div class="search">
        Date :
        <input type="text" id="datepicker" name="datepicker" />
    </div>
0
Roman GhermanSenior Software EngineerCommented:
hmm, I can't see anything strange in that code.
0
ToString1Author Commented:
I reckon it maybe to do with nested master pages.   However it does seem strange that to iterate through and created an unordered list results in the date picker not working.

0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Web Frameworks

From novice to tech pro — start learning today.