Basic knockout-jqAutocomplete samples

by arame3333

HTML

<script src="http://knockoutjs.com/downloads/knockout-3.0.0.js"></script>
<script src="https://rawgithub.com/rniemeyer/knockout-jqAutocomplete/master/build/knockout-jqAutocomplete.js"></script>
<table>
           <tbody data-bind="foreach: Lines">
            <tr>
                <td style="width: 380px">
                    <input type="text"
                           data-bind="jqAuto: { source: $parent.Contracts, value: JobName, labelProp: 'Label', valueProp: 'ContractId' }"
                           style="width: 99%;" />
                </td>
                <td style="width: 160px">
                    <input type="text" data-bind="value: Description" style="width: 99%;" />
                </td>

            </tr>
        </tbody>
</table>

<script id="itemTmpl" type="text/html">
    <a>
        <strong data-bind="text: id"></strong>
        <em data-bind="text: name"></em>
    </a>
</script>

JavaScript

var lineMapping = {
    'Lines': {
        key: function (line) {
            return ko.unwrap(line.TimeEntryRowId);
        },
        create: function (options) {
            return new TimesheetLineViewModel(options.data);
        }
    }
};

var addNumbers = function (result, number) {
    if (number === null || number === "") {
        return result;
    }

    return result + parseFloat(number);
}

TimesheetLineViewModel = function (data) {
    var self = this;

    ko.mapping.fromJS(data, lineMapping, self);

    self.WeekHrs = ko.pureComputed(function () {
        var result = addNumbers(0, self.SaturdayHrs());
        result = addNumbers(result, self.SundayHrs());
        result = addNumbers(result, self.MondayHrs());
        result = addNumbers(result, self.TuesdayHrs());
        result = addNumbers(result, self.WednesdayHrs());
        result = addNumbers(result, self.ThursdayHrs());
        result = addNumbers(result, self.FridayHrs());
        return result;
    });
};

TimesheetWholeViewModel = function (data) {
    var self = this;
    ko.mapping.fromJS(data, lineMapping, self);

    self.save = function() {
            $.ajax({
                url: data.SaveUrl,
                type: "POST",
                data: ko.toJSON(self),
                contentType: "application/json",
                success: function(data) {
                    if (data != null) {
                        self.showMessage(data);
                    };
                }
            });
        },
        self.submit = function() {
            $.ajax({
                url: data.SubmitUrl,
                type: "POST",
                data: ko.toJSON(self),
                contentType: "application/json",
                success: function(data) {
                    if (data != null) {
                        if (data.Success) {
                            self.backToList();
                        } else {
                            self.showMessage(data);
               ...