jQuery // Moving up and down on Arrow Down event
I'm trying to replicate the same event you can do inside ms access datagrid where you can use the arrow up and down to move from a row. As for a example I only showed 2 rows but it could be much more.
I've got the following HTML
<div class="cell celldata cell_service_data" id="cell_service_rate_1">
<input type="tex开发者_运维技巧t" id="rate_service_row_1" class="rate_service_row"/>
</div>
<div class="cell celldata cell_service_data" id="cell_service_rate_2">
<input type="text" id="rate_service_row_2" class="rate_service_row"/>
</div>
And the jQuery
$('.rate_service_row').keydown(function (e) {
var rateId = $(this).attr('id');
var keyCode = e.keyCode || e.which,
arrow = {left: 37, up: 38, right: 39, down: 40 };
switch (keyCode) {
case arrow.left:
//..
break;
case arrow.up:
//..
break;
case arrow.right:
//..
break;
case arrow.down:
//Set focus to the same cell next row
break;
}
});
So my question is how can I in jquery put inside the arrow.down case the following logic.
nextcell = cell_service_rate_1 + 1 and should equal cell_service_rate_2If I understand correctly can't you just do like i = 1
... nextcell = "cell_service_rate" + i;
EDIT Using parseInt() this jsfiddle works doing what I think you want. I still think it's more elegant to have from the start some i counter to create the strings though.
http://jsfiddle.net/mazlix/byjmF/3/
EDIT
And HERE is an example of more what I think you should be doing, by having an index (in this case the 'rel' attribute)
http://jsfiddle.net/mazlix/byjmF/9/
Something similar to this?
var rateId = $(this).attr('id');
//Get the number of the currently selected cell
var curCell = rateId.substr(-1);
... code ...
case arrow.down:
//Go one row lower.. so plus 1
var newCell = curCell + 1;
//Define the new identifier
var newCellId = 'rate_service_row_' + newCell;
var element = $(newCellId);
//Focus on the element if it exists (element.length checks that)
if (element.length != 0) {
element.focus();
}
break;
Better would be to detect the last occurence of the underscore of your rateId, rather than doing a substr(-1) because this just works for 0-9. But I'm sure you get the idea.
精彩评论