jquery creating variable and using it to for load - laravel

Question

I am a newbie in jQuery, obviously I don't really understand some basics, although I have read some tutorials.

I Have two buttons:

<a id="test1" onclick="getbyText()" displaymode="newcontent/events/newest">News 1</a>

<a id="test2" onclick="getbyVar()" displaymode="newcontent/events/oldest">News 2</a>

<a id="test_output"> - - -</a>

I want to use them to load content of a div with id="dashcontent"

My Route looks like this:

Route::get('newcontent/latest_events/{mode}', 'ReportsController@newcontent_partials');

My controller method is this:

public function newcontent_partials($mode)
{


    if($mode == 'importance') {

    $rnd = rand(4, 5);  // just for testing purpose

    $top5events = Event1::
            ->orderBy('id', 'desc')
            ->take($rnd)
            ->get();

    $test_type = 'ajax OK - OLDEST';
    }
    else {

    $rnd = rand(5, 6);

    $top5events = Event1::
            ->orderBy('id', 'asc')
            ->take($rnd)
            ->get();

    $test_type = 'ajax OK - NEWEST';


    }


return View::make('partials._event_minibox', compact('test_type','top5events','rnd'));
}

My script looks like this:

This works just as expected:

function getbyText() {
$("#dashcontent").toggleClass( "col_12" );  // just to see that the script is working
$('#dashcontent').load('newcontent/latest_events/newest');
}

This works only if load target is delivered as plain text:

function getbyVar() {
$('#test_output').text($('#test2').attr("displaymode"));  // printing the value of attr
var linkcode = $('#demo3').attr("displaymode"); // creating the variable 
$('#dashcontent').load(linkcode);  // THIS WILL NOT LOAD 
$('#test_output').text(linkcode); // surprisingly, this one works!!!
}

if in the above code getbyVar function I use

$('#dashcontent').load('newcontent/latest_events/newest');  

then the thing is working as expected

---

Please help me to solve these two problems:

1. Make the loading div content work with the variable displaymode. Note: it can be a different solution than the one I am trying to implement.

2. Make the function work extract the attr("displaymode") of the element which is clicked.

not from an element with specified ID. I have tried this:

var linkcode = $(this).attr("displaymode");

but contrary to examlpes I have found on-line, in case of my code doesn't work.

Any help appreciated. Thx

Answer 1

Update:

I don't see any id "demo3" in your markup code:

$('#demo3').attr("displaymode"); // creating the variable 

I guess you want to use the "displaymode" attribute of clicked anchor, so for this you can pass this as an argument:

onclick="getbyText(this)"  
onclick="getbyVar(this)"

then in your functions:

function getbyText(elem) {
    // use elem as a clicked elem.
}

function getbyVar(elem) { // elem is clicked element
    $(elem).attr("displaymode"); // get the attr of clicked elem
}

---

Or more unobtrusive way:

$('a[id^="test"]').on('click', function(e){
    if(this.id === "test1"){
       // code for test1
    }else if(this.id === "test2"){
       // code for test2
    }
});

even you can use switch cases here.