Click here to Skip to main content
15,896,912 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
See more:
Hi, have a problem with realization of autocomplete in a jQuery table, what I'm displaying using each loop... if I do it with an array inside my code, it works, bit from Database it showas error, have somebody any idea why?

What I have tried:

function loadWeekData() {

    
    // Append database data here
    
    $.ajax({
        type: "GET",
        url: "/Home/JsonWeekEvents",
        dataType: "JSON",
        success: function (result) {
            $.each(result, function (i, val) {
                
                var trow = $('<tr/>').data("id", val.Id);
                //trow.append('<td>' + val.Id + " " + '</td>');
                trow.append('<td style="padding:5px; width:100px; height:70px"></td>');
                trow.append('<td valign="top" style="padding:2px; width:150px; height:100px">' +
                                '<div class="ui-widget">' +
                                        '<input  size="10" maxlength="10" id="tags" />' +
                                            '<input type="button" id="addBtn" onclick="addEvent();" size="5" value="+" /><br/>' +
                                                 '<div style="text-align:center" id="desc_Num">' + val.Monday + '</div >' +
                                '</div >' +
                            '</td>');
                
                tab.append(trow);
            });
            
            $("tr:odd", tab).css('background-color', '#C4C4C4');
            $("#weekEvents").html(tab);
        },
        error: function () {
            alert("Failed! Please try again.");
        }
    });
    var tab = $('<table class=MyTable border=1 ></table>');
    var thead = $('<thead></thead>');
    
    thead.append('<th style="padding:5px">FSE' + " " + '</th>');
    thead.append('<th style="padding:5px">Monday' + " " + '</th>');
    thead.append('<th style="padding:5px">Tuesday' + " " + '</th>');
    thead.append('<th style="padding:5px">Wednesday' + " " + '</th>');
    thead.append('<th style="padding:5px">Thursday' + " " + '</th>');
    thead.append('<th style="padding:5px">Friday' + " " + '</th>');
    thead.append('<th style="padding:5px">Saturday' + " " + '</th>');
    thead.append('<th style="padding:5px">Sunday' + " " + '</th>');
 
    tab.append(thead);


    tab.on("focus", "input[id='tags']", function (e) {

        $("#tags").autocomplete({
            source: function (request, response) {
                $.ajax({
                    url: '@Url.Action("GetSearchValue","Home")',
                    dataType: "json",
                    data: { search: $("#tags").val() },
                    success: function (data) {
                        response($.map(data, function (item) {
                            return {
                                label: item.Title + ', ' + item.Description, value: item.Title,

                                Id: item.Id,
                                Title: item.Title,
                                Description: item.Description,
                                Location: item.Location
                            }
                        }));
                    },
                    error: function (xhr, status, error) {
                        alert("Error!");
                    },

                });
            }
        });




        //    var availableTags = [
        //        "ActionScript",
        //        "AppleScript",
        //        "Asp",
        //        "BASIC",
        //        "C",
        //        "C++",
        //        "Clojure",
        //        "COBOL",
        //        "ColdFusion",
        //        "Erlang",
        //        "Fortran",
        //        "Groovy",
        //        "Haskell",
        //        "Java",
        //        "JavaScript",
        //        "Lisp",
        //        "Perl",
        //        "PHP",
        //        "Python",
        //        "Ruby",
        //        "Scala",
        //        "Scheme"
        //    ];

        //    $("#tags").autocomplete({
        //        source: availableTags
           
        //});



        
 });



My Controller:
public JsonResult GetSearchValue(string search)
        {
            List<Event> eventsList = new List<Event>();
            using (EventsDBEntities db = new EventsDBEntities())
            {
                eventsList = db.Events.Where(x => x.Title.Contains(search)).ToList();
            }
            return new JsonResult { Data = eventsList, JsonRequestBehavior = JsonRequestBehavior.AllowGet };
        }
Posted
Updated 18-May-20 6:30am
v3
Comments
F-ES Sitecore 18-May-20 12:21pm    
Error messages generally have text that indicate what the problem is, so what is the exact error message?
Member 14803832 18-May-20 12:23pm    
Error![object Object]

1 solution

Solution:

url: "/Home/GetSearchValue",
instead of:
url: '@Url.Action("GetSearchValue","Home")',
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900