JSFiddle - React, Tailwind, and code Playground

by eTiger13

HTML

getAliasForMatchAll = {"aliases_id": [{"id": 60}, {"id": 53}, {"id": 51}, {"id": 68}]}

JavaScript

var i;
var j;
var list_left;
var list_right;

function load(data){
    list_left = new Array(data.length);
    list_right = new Array(data.length);
    for (alias in data){
        list_left[alias] = data[alias].id;
        list_right[alias] = data[alias].id;
    }
    i = -1;
    j = -1;

}

function previous_left(){
    if(j<=0){
        var l = 0;
        j = 0;
    }
    else {
        var l = j-=1;
    }
    $("#alias_id_left").val(list_left[l]);
    $("#merge_alias_id_left").val(list_left[l]);
    /*$.post("/visor/",{"alias_id":list_left[l],"position":"L"},
            function(data){
                $("#tabsL").html(data).ajaxComplete(function(){
                    $("#tabsL").tabs();
                });
            });
    */
    $.ajax({
        type:'POST',
        url:'/visor/',
        data:{"alias_id":list_left[l],"position":"L"},
        success:function(data){
            $("#tabsL").html(data).tabs();
            });
        }
    });
}

function next_left(){
    if(j >= array.length-1){
        var l = j
    } else {
        var l = j+=1;
    }
    $("#alias_id_left").val(list_left[l]);
    $("#merge_alias_id_left").val(list_left[l]);
    $.post("/visor/",{"alias_id":list_left[l],"position":"L"},
            function(data){
                $("#tabsL").html(data).tabs();
            });
}

function previous_right(){
    console.log("Previous right!");
    if(i<=0){
        var l = 0;
        i = 0;
    }
    else {
        i = i -1;
        var l = i;
    }
    $("#alias_id_right").val(list_right[l]);
    $("#merge_alias_id_right").val(list_right[l]);
    $.post("/visor/",{"alias_id":list_right[l],"position":"R"},
            function(data){
                $("#tabsR").html(data);

            });
}


function next_right(){
    if( i>= array.length-1){
        var l = i;
    } else {
        i = i+1;
        var l = i;
    }
    $("#alias_id_right").val(list_right[l]);
    $("#merge_alias_id_right").val(list_right[l]);
   ...