Other ways to update a SQL DB

[szlamany]

We have a "grid" using JS that can be edited.

When the user put a student grade in a cell - we would like to UPDATE a field in a SQL DB with that value.

What other methods are there besides using vb-code-behind and postbacks?

[techgnome]

fist thing that comes to my mind is AJAX....

-tg

[szlamany]

We created the GRID with JS so that we could run the "editing" of the grid client side - a teacher is going to travel down a column and pump in grades for 30 students for a quiz, for example.

The grid movement is reasonable.

Now the update to the DB is the problem - how would AJAX help us with this?

My programmer is looking into XMLHTML - I'm not even sure what that is!

[techgnome]

AJAX could be used to send the data back to the webserver asynchronously with out the need to actualy post the whole page & do a complete round trip - like the quick reply here in VBF, when you hit the post button, it uses AJAX behind the scenes to gather the data and then post it back to the webserver bewind the scenes. You could do something similar. You could send the info as the user changes to a new row, or send it all back at once when done. You'll still need a serverside web page to send the info to, but if done right, it's not something the user will ever see.

-tg

[szlamany]

What syntax would you use in the page that would do that? (would it be a JS call - an HTML call?)

[techgnome]

from the client it would be JS.... the page it would call to would either be ASP or PHP or what ever server technology you want to use.

-tg

[szlamany]

Thanks - I'll have my programmer start testing this idea today...

[szlamany]

We were thinking of using the following Javascript code to do what it sounds like you are talking about with XmlHttp:

<script type="text/javascript">

var xmlhttp;
function loadXMLDoc(url)
{
xmlhttp=null;
if (window.XMLHttpRequest)
  {// code for all new browsers
  xmlhttp=new XMLHttpRequest();
  }
else if (window.ActiveXObject)
  {// code for IE5 and IE6
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
if (xmlhttp!=null)
  {
  xmlhttp.onreadystatechange=state_Change;
  xmlhttp.open("GET",url,true);
  xmlhttp.send(null);
  }
else
  {
  alert("Your browser does not support XMLHTTP.");
  }
}

function state_Change()
{
if (xmlhttp.readyState==4)
  {// 4 = "loaded"
  if (xmlhttp.status==200)
    {// 200 = OK
    alert(xmlhttp.responseText);
    }
  else
    {
    alert("Problem retrieving XML data");
    }
  }
}
</script>

What would ajax code for this be? Or at least something we can research?

[techgnome]

That IS AJAX! That's exactly how it works....

-tg

[mendhak]

You can GET and POST with it too. Have you also looked at the AJAX framework that's part of ASP.NET? You encapsulate the whole thing in an UpdatePanel which is an area of demarcation which is posted back to the server each time, so it can get a little top-heavy if it's going to be heavily used but it also lets you perform updates in the codebehind (same page) without having to add the client side script. Worth a look.

[szlamany]

We are concerned about visual performance for the user.

30 or so students (rows) and lots of tests and quizzes (columns) - which I believe we can really only create with a repeater.

I want the teacher to be able to move around the grid and change cells - have those be "pushed" back to the DB - and quickly move to other cells - all without a noticeable delay.

Exactly like you see no delay in EXCEL.

[brin351]

Even with ajax there is a delay unless you ignore/don't need the response. You could do something like call the ajax function "onblur" event of textbox or other input element and if the sever doesn't return some variable like "update=true" then alert the user. So every time the user moves focus off an element the ajax function fires and only interupts the user on an error. You can validate on the client & server before making the DB update.

[szlamany]

We are thinking that the user will either be working a column (more likely) or a row (not as likely) - but not usually popping from cell-to-cell. We are going to test how sending updates for a whole row or column works out - as long as they stay in a particular column or in a particular row we tank-up all those changes to be sent at once.

I wonder how legitimate it would be to just hold the whole grid-data client side until they leave that page - as long as you wrote it to a log file you could make that a nearly disaster-free technique...

[mendhak]

Ensure that you have sufficient validation in place so that the user doesn't send mistakes through to the database.

If you hold the entirety of the data client-side, then you'll have to provide the user with a button that performs a postback - that'll be the usual behavior you're used to. You could also combine the two. onblur makes a call via XmlHttpRequest to save the data, the button saves the data anyways.

But yes, check performance first. Make the calls async too so that the page won't lock up.