Click here to Skip to main content
14,733,966 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 7: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")',
   

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