Archive for November, 2016

jQuery function to highlight drop down list not working

I had an HTML select control generated from MVC Razor:

@Html.DropDownList("coasters", (List<SelectListItem>)ViewBag.Coasters, "--Select--", new { @class = "form-control")

I had a jQuery method that was supposed to highlight the drop down list value using the “val” method:

function loadCoaster(coaster) {
        $('#coasters').val(coaster);
}

But it wasn’t working. The value in the drop down list would flash briefly, then disappear.

What I found worked was setting the “selected” attribute by using jQuery’s “attr” method:

function loadCoaster(coaster) {
        $('select[name^="coasters"] option[value="' + coaster + '"]').attr("selected", "selected");
}

Using this, the value stuck.

Leave a comment

Using a LIKE query in an Oracle procedure

I had two parameters that could be passed to a procedure. Only one was being passed into the procedure – business layer code makes sure of that – so if the pId parameter is present AND it is a match return the record. But I also needed to return the results if the pName parameter was filled out, and do a LIKE query on that field. And since half the reason for this blog is so when I forget how to do it, I can find it again:

PROCEDURE Search(pName IN VARCHAR, pId IN NUMBER, p_cursor OUT sys_refcursor) IS

   BEGIN
       OPEN p_cursor FOR
           SELECT ID, Name
           FROM users 
           WHERE ((pId IS NOT NULL) AND (ID = pId))
           OR ((pName IS NOT NULL) AND (Name LIKE '%' || UPPER(pName) || '%'));
END;

Leave a comment

Partial View returning the full view instead of partial view contents

I had an odd result trying to return an ASP.NET MVC partial view from a controller after a POST request. The setup was simple.  I had a view that contained a partial view with a grid. Nothing fancy in the view:

@model IEnumerable<Models.Code>

<h2>Code Maintenance</h2>

@{     Html.RenderPartial("~/Views/_CodeTable.cshtml", Model); }

The partial view contained a table:

@model IEnumerable<Models.Code>

<table class="table table-striped table-bordered">
    <tr>
        <th>
            @Html.DisplayNameFor(model => model.Code)
        </th>
        <th></th>
    </tr>

    @foreach (var item in Model) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Code)
            </td>
            <td><a onclick="loadCode(this, '@item.Code')"></a></td>
        </tr>
    }
</table>

When the page loaded initially, everything was fine. But when I tried to update the partial view using some jQuery code, the I would get HTML results like so:

<h2>Code Maintenance</h2>

<h2>Code Maintenance</h2>

<table>
 <tr><td>1</td></tr>
 <tr><td>2</td></tr>
 <tr><td>3</td></tr>
</table>

There was also global code in the _layout.cshtml being returned as part of the partial view, though I am not showing that here. So basically, the partial view wasn’t being treated like a partial view, and was instead being treated like a view, and the “Code Maintenance” title, along with my _layout.cshtml code, was being displayed twice when it should have only been shown once.

The problem in this case was my controller. I was returning a view instead of a partial view. Here is wrong code:

        [HttpPost]
        public ActionResult Code(Code model) {
            List<Code> results = new List<Code>();
            ...
            return View(results);
        }

And here is the corrected code:

     [HttpPost]
     public ActionResult Code(Code model) {
         List<Code> results = new List<Code>();
         ...
         return PartialView("_table", results);
     }

In case you are curious, here is how I loaded the code in jQuery:

function updateCode(id) {

    var data = { id: id };

    $.ajax({
        url: uri + 'MyController/UpdateCode',
        type: 'POST',
        cache: false,
        async: false,
        contentType: 'application/json',
        data: JSON.stringify(data),
        success: function (partialViewResult) {
            $("#results").html(partialViewResult);
        },
        error: function (jqXHR, textStatus, errorThrown) {
            alert('Error saving the code');
        }
    });
}

Leave a comment