1

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

1 Answer 1

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.

Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.