I'm using Wordpress, and trying to figure out how to hack the links within the sub-menus.
I've set up a demo here: http://brandsite.simpletruth.io/logo/
Specifically, I want to add a hash in front of second-level menu links so that they become same-page anchors instead of going to a separate page.
For instance:
http://brandsite.simpletruth.io/logo/logo-spacing/
Becomes:
http://brandsite.simpletruth.io/logo#logo-spacing
Ideally this happens within Wordpress, but I think doing it with javascript would be an okay solution too.
Thanks!
you have to use a custom walker function
in your instance:
in your functions
class custom_names extends Walker_Nav_Menu
{
/* Start of the <ul>
*
* Note on $depth: Counterintuitively, $depth here means the "depth right before we start this menu".
* So basically add one to what you'd expect it to be
*/
function start_lvl(&$output, $depth = 0, $args = array())
{
$indent = str_repeat("\t", $depth);
$output .= "\n$indent<ul class=\"children\">\n";
}
/* End of the <ul>
*
* Note on $depth: Counterintuitively, $depth here means the "depth right before we start this menu".
* So basically add one to what you'd expect it to be
*/
function end_lvl( &$output, $depth = 0, $args = array() ) {
$indent = str_repeat("\t", $depth);
$output .= "$indent</ul>\n";
}
/* Output the <li> and the containing <a>
* Note: $depth is "correct" at this level
*/
function start_el( &$output, $item, $depth = 0, $args = array(), $current_object_id = 0 )
{
$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$classes[] = 'menu-item-' . $item->ID;
$args = apply_filters( 'nav_menu_item_args', $args, $item, $depth );
$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args, $depth ) );
$class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';
$id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args, $depth );
$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
$output .= $indent . '<li' . $id . $class_names .'>';
$atts = array();
$atts['title'] = ! empty( $item->attr_title ) ? $item->attr_title : '';
$atts['target'] = ! empty( $item->target ) ? $item->target : '';
$atts['rel'] = ! empty( $item->xfn ) ? $item->xfn : '';
$atts['href'] = ! empty( $item->url ) ? $item->url : '';
$atts = apply_filters( 'nav_menu_link_attributes', $atts, $item, $args, $depth );
$attributes = '';
foreach ( $atts as $attr => $value ) {
if ( ! empty( $value ) ) {
$value = ( 'href' === $attr ) ? esc_url( $value ) : esc_attr( $value );
$attributes .= ' ' . $attr . '="' . $value . '"';
}
if ($depth == 1) {
$attributes = ' ' . $attr . '="'.str_replace(basename ($item->url), '#'.str_replace(' ', '-', strtolower ($item->title)), $value).'"';
}
}
$title = apply_filters( 'the_title', $item->title, $item->ID );
$title = apply_filters( 'nav_menu_item_title', $title, $item, $args, $depth );
$item_output = $args->before;
$item_output .= '<a'. $attributes .'>';
$item_output .= $args->link_before . $title . $args->link_after;
$item_output .= '</a>';
$item_output .= $args->after;
$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}
/* Close the <li>
* Note: the <a> is already closed
* Note 2: $depth is "correct" at this level
*/
function end_el ( &$output, $item, $depth = 0, $args = array())
{
$output .= '</li>';
return;
}
/* Add a 'hasChildren' property to the item
* Code from: http://wordpress.org/support/topic/how-do-i-know-if-a-menu-item-has-children-or-is-a-leaf#post-3139633
*/
function display_element ($element, &$children_elements, $max_depth, $depth = 0, $args, &$output)
{
// check whether this item has children, and set $item->hasChildren accordingly
$element->hasChildren = isset($children_elements[$element->ID]) && !empty($children_elements[$element->ID]);
// continue with normal behavior
return parent::display_element($element, $children_elements, $max_depth, $depth, $args, $output);
}
}
in your header.php (or wherever your menu is)
<?php wp_nav_menu( array('walker' => new custom_names())); ?>
Related
I have added a "load more" button with ajax by following this posting...
Load More Posts Ajax Button in Wordpress
However, I need to add in some custom HTML for the content to sit in. I tried making a template and adding that into my ajax call but I couldn't get it working as the entire template would post 5 times.(I'm incrementing posts by 5). My question is, how do you structure the HTML in PHP for the ajax object?
My ajax function is here (in functions.php):
function more_post_ajax(){
$ppp = (isset($_POST["ppp"])) ? $_POST["ppp"] : 5;
$page = (isset($_POST['pageNumber'])) ? $_POST['pageNumber'] : 0;
header("Content-Type: text/html");
$myposts = get_posts( $args );
$postcounter = 1;
$mediumcounter = 0;
$smallcounter = 0;
$args = array(
'suppress_filters' => true,
'post_type' => 'post',
'posts_per_page' => $ppp,
// 'cat' => 8,
'paged' => $page,
);
$loop = new WP_Query($args);
$out = '';
if ($loop -> have_posts()) : while ($loop -> have_posts()) : $loop -> the_post();
/******I NEED TO CHANGE THE BELOW*******/
$out .= '<div class="parent">
<h1>play ball '.get_the_title().'</h1>
<p>'.get_the_content().'</p>
</div>';
endwhile;
endif;
wp_reset_postdata();
die($out);
The template file I was trying to load up looks like this...
<?php
$args = array(
'posts_per_page' => 5
);
$myposts = get_posts( $args );
$postcounter = 1;
$mediumcounter = 0;
$smallcounter = 0;
foreach ( $myposts as $post ) : setup_postdata( $post );
if($postcounter == 1 ){
echo '<div class="parent">';
echo '<div class="single postwrapper child-2 postwrapper'.$postcounter.' mediumpost gray">';
}
else if($postcounter == 2 ){
echo '<div class="multi postwrapper child-2 ">';
echo '<div class="parent">';
}else{
$smallcounter = $smallcounter + 1;
if(in_array($smallcounter, array(1,2))){
$postcolor = 'blue';
}else{
$postcolor = 'gray';
}
}
echo '<div class="postwrapper child-2 postwrapper'.$postcounter.' smallpost '. $postcolor .'">';
get_template_part( 'homenew', get_post_format() );
echo '</div>';
if($postcounter == 1 || $postcounter == 5 ){
echo '</div>';
if($postcounter == 5){
echo '</div>';
}
}
$postcounter = $postcounter + 1;
endforeach;
wp_reset_postdata();?>
Would I have to write the template file out in the ajax function? Or just send post info to the javascript and append custom js with jquery?
i have an issue with jQuery datatables i want to use server-side processing, because to much data to load. but from the documentation i have read it use native php, i use codeigniter 3. it quite difficult to modify the code. here's the code i use in my controller
public function dataTable()
{
$sIndexColumn = "";
$sTable = "myTable";
$gaSql['user'] = "test";
$gaSql['password'] = "t3st";
$gaSql['db'] = "myDatabase";
$gaSql['server'] = "Driver={SQL Server Native Client 10.0};Server=ITI-0299-PC\JTSMSSQLSERVER;Port=1326;Database=myDatabase; Uid=test;Pwd=t3st;"; //Locale
$aColumns = array(
'id','nmrumahsakit','alamat','kota',
'provinsi','rawat_inap','rawat_jalan',
'mcu','telp','fax','latitude',
'longitude','created_at','updated_at');
/*
* ODBC connection
*/
$connectionInfo = array("UID" => $gaSql['user'], "PWD" => $gaSql['password'], "Database"=>$gaSql['db'],"ReturnDatesAsStrings"=>true);
$gaSql['link'] = sqlsrv_connect( $gaSql['server'], $connectionInfo);
$params = array();
$options = array( "Scrollable" => SQLSRV_CURSOR_KEYSET );
/* Ordering */
$sOrder = "";
if ( isset( $_GET['iSortCol_0'] ) ) {
$sOrder = "ORDER BY id ";
for ( $i=0 ; $i<intval( $_GET['iSortingCols'] ) ; $i++ ) {
if ( $_GET[ 'bSortable_'.intval($_GET['iSortCol_'.$i]) ] == "true" ) {
$sOrder .= $aColumns[ intval( $_GET['iSortCol_'.$i] ) ]."
".addslashes( $_GET['sSortDir_'.$i] ) .", ";
}
}
$sOrder = substr_replace( $sOrder, "", -2 );
if ( $sOrder == "ORDER BY id" ) {
$sOrder = "";
}
}
/* Filtering */
$sWhere = "";
if ( isset($_GET['sSearch']) && $_GET['sSearch'] != "" ) {
$sWhere = "WHERE (";
for ( $i=0 ; $i<count($aColumns) ; $i++ ) {
$sWhere .= $aColumns[$i]." LIKE '%".addslashes( $_GET['sSearch'] )."%' OR ";
}
$sWhere = substr_replace( $sWhere, "", -3 );
$sWhere .= ')';
}
/* Individual column filtering */
for ( $i=0 ; $i<count($aColumns) ; $i++ ) {
if ( isset($_GET['bSearchable_'.$i]) && $_GET['bSearchable_'.$i] == "true" && $_GET['sSearch_'.$i] != '' ) {
if ( $sWhere == "" ) {
$sWhere = "WHERE ";
} else {
$sWhere .= " AND ";
}
$sWhere .= $aColumns[$i]." LIKE '%".addslashes($_GET['sSearch_'.$i])."%' ";
}
}
/* Paging */
$top = (isset($_GET['iDisplayStart']))?((int)$_GET['iDisplayStart']):0 ;
$limit = (isset($_GET['iDisplayLength']))?((int)$_GET['iDisplayLength'] ):10;
$sQuery = "SELECT TOP $limit ".implode(",",$aColumns)."
FROM $sTable
$sWhere ".(($sWhere=="")?" WHERE ":" AND ")." $sIndexColumn NOT IN
(
SELECT $sIndexColumn FROM
(
SELECT TOP $top ".implode(",",$aColumns)."
FROM $sTable
$sWhere
$sOrder
)
as [virtTable]
)
$sOrder";
$rResult = sqlsrv_query($gaSql['link'],$sQuery) or die("$sQuery: " . sqlsrv_errors());
$sQueryCnt = "SELECT * FROM $sTable $sWhere";
$rResultCnt = sqlsrv_query( $gaSql['link'], $sQueryCnt ,$params, $options) or die (" $sQueryCnt: " . sqlsrv_errors());
$iFilteredTotal = sqlsrv_num_rows( $rResultCnt );
$sQuery = " SELECT * FROM $sTable ";
$rResultTotal = sqlsrv_query( $gaSql['link'], $sQuery ,$params, $options) or die(sqlsrv_errors());
$iTotal = sqlsrv_num_rows( $rResultTotal );
$output = array(
"sEcho" => intval($_GET['sEcho']),
"iTotalRecords" => $iTotal,
"iTotalDisplayRecords" => $iFilteredTotal,
"aaData" => array()
);
while ( $aRow = sqlsrv_fetch_array( $rResult ) ) {
$row = array();
for ( $i=0 ; $i<count($aColumns) ; $i++ ) {
if ( $aColumns[$i] != ' ' ) {
$v = $aRow[ $aColumns[$i] ];
$v = mb_check_encoding($v, 'UTF-8') ? $v : utf8_encode($v);
$row[]=$v;
}
}
If (!empty($row)) { $output['aaData'][] = $row; }
}
echo json_encode( $output );
}
in this is js configuration for datatables:
$('#datatable2').dataTable({
"sScrollY": "400px",
"bProcessing": true,
"bServerSide": true,
"sServerMethod": "GET",
"sAjaxSource": "<?php echo base_url(); ?>mycontroller/mymethod",
"iDisplayLength": 10,
"aLengthMenu": [[10, 25, 50, -1], [10, 25, 50, "All"]],
"aaSorting": [[0, 'asc']],
"aoColumns": [
{ "bVisible": true, "bSearchable": true, "bSortable": true },
{ "bVisible": true, "bSearchable": true, "bSortable": true },
{ "bVisible": true, "bSearchable": true, "bSortable": true }
]
}).fnSetFilteringDelay(700);
});
and this is the view:
<table id="datatable2" class="table table-bordered table-hover">
<thead>
<tr>
<th>No</th>
<th>Nama R.S</th>
<th>Alamat</th>
<th>Kota</th>
<th>Provinsi</th>
<th>Rawat Inap</th>
<th>Rawat Jalan</th>
<th>MCU</th>
<th>No.Telp</th>
<th>No.Fax</th>
<th>Latitude</th>
<th>Longitude</th>
<th>Created At</th>
<th>Updated At</th>
<th>Menu</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
after test it, ive got this error.
A PHP Error was encountered
Severity: Error
Message: Call to undefined function sqlsrv_connect()
Filename: controllers/Provider.php
Line Number: 302
Backtrace:
I already use connection in config/database.php
and my question is how to user server-side processing in codeigniter?
Problem above solve, but i've got new problem with js.
DataTables warning (table id = 'datatable2'): DataTables warning: JSON
data from server could not be parsed. This is caused by a JSON
formatting error.
CMIIW
It seems that your PHP installation is missing an extension that allows you to use the sqlsrv_connect function.
Make sure that php_sqlsrv_XX_ts.dll extension is loaded in your php.ini.
I am trying to set up a custom walker for my wordpress menu. Its purpose is to allow me to add php code to the menu links as I could with text and images like this:
<a href="http://mcadrives.com/?ref=<?PHP code goes here?>">
The php coding I have been using on every hyperlink and image is this:
<a href="http://mcadrives.com/?ref=
<?php
if (!empty ( $_SERVER['QUERY_STRING'])){
echo substr($_SERVER['QUERY_STRING'],4); }
else{
echo 'mhammonds'; }
?>>
I added this to my functions.php file:
class Query_Nav extends Walker_Nav_Menu
{
function start_el( &$output, $item, $depth = 0, $args = array(), $id = 0 ) {
global $wp_query;
$indent = ( $depth ) ? str_repeat( "\t", $depth ) : '';
$class_names = $value = '';
$classes = empty( $item->classes ) ? array() : (array) $item->classes;
$classes[] = 'menu-item-' . $item->ID;
$class_names = join( ' ', apply_filters( 'nav_menu_css_class', array_filter( $classes ), $item, $args ) );
$class_names = $class_names ? ' class="' . esc_attr( $class_names ) . '"' : '';
$id = apply_filters( 'nav_menu_item_id', 'menu-item-'. $item->ID, $item, $args );
$id = $id ? ' id="' . esc_attr( $id ) . '"' : '';
$output .= $indent . '<li' . $id . $value . $class_names .'>';
$attributes = ! empty( $item->attr_title ) ? ' title="' . esc_attr( $item->attr_title ) .'"' : '';
$attributes .= ! empty( $item->target ) ? ' target="' . esc_attr( $item->target ) .'"' : '';
$attributes .= ! empty( $item->xfn ) ? ' rel="' . esc_attr( $item->xfn ) .'"' : '';
//ADD YOUR PHP HERE TO DETERMINE WHATEVER IT IS YOU NEED FOR YOUR LINK
if ( ! empty ( $_SERVER['QUERY_STRING'] ) ) {
$addedStuff = '?ref=' . substr( $_SERVER['QUERY_STRING'], 4 );
}else {
$addedStuff = '?ref=mhammonds';
}
$attributes .= ! empty( $item->url ) ? ' href="' . esc_attr( $item->url.$addedStuff) .'"' : '';
////////////////////
$item_output = $args->before;
$item_output .= '<a'. $attributes .'>';
$item_output .= $args->link_before . apply_filters( 'the_title', $item->title, $item->ID ) . $args->link_after;
$item_output .= '</a>';
$item_output .= $args->after;
$output .= apply_filters( 'walker_nav_menu_start_el', $item_output, $item, $depth, $args );
}
}
and I added this walker 'new Query_Nav' to my nav-menu-template.php:
function wp_nav_menu( $args = array() ) {
static $menu_id_slugs = array();
$defaults = array( 'menu' => '', 'container' => 'div', 'container_class' => '', 'container_id' => '', 'menu_class' => 'menu', 'menu_id' => '',
'echo' => true, 'fallback_cb' => 'wp_page_menu', 'before' => '', 'after' => '', 'link_before' => '', 'link_after' => '', 'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s</ul>',
'depth' => 0, 'walker' => 'new Query_Nav()', 'theme_location' => '' );
I was then informed by a WARNING that class 'new Query_Nav()' is not found on Line 660, so I added it like so:
function walk_nav_menu_tree( $items, $depth, $r ) {
$walker = ( empty($r->walker) ) ? new Walker_Nav_Menu : $r->walker;
$args = array( $items, $depth, $r );
return call_user_func_array( array( $walker, 'walk', 'new Query_Nav()'), $args );
Now I have another WARNING stating:
call_user_func_array() expects parameter 1 to be a valid callback, array must have exactly two members in /home/ballaboy258/public_html/wp-includes/nav-menu-template.php on line 660
I have removed each one and neither has solved the problem. If I remove $walker, then 'walk' is not found. If I remove 'walk', then 'new Query_Nav()' is not found. If I remove 'new Query_Nav()', again, "new Query_Nav()' is not found. It doesn't make any sense.
Did I miss a step, or is my syntax wrong? I'm confused and I can't find anything on the web to help me.
It means that your callback array
array( $walker, 'walk', 'new Query_Nav()'),
should comprise two elements
a class
a method
that represent the function you are calling
You have provided three
I cannot retrieve the <p> elements that i echo in my php script. I'd like a solution / correction similar to mine because next to the data retrieve i have to style the <p> nodes with a javascript function. I'll be glad if my page doesn't refresh.
PHP:
<?php
$username = "root" ;
$database = "leaderboard" ;
$host = "localhost" ;
$connection = mysql_connect ( $host, $username ) or die ( "Impossibile stabilire connessione con il database della classifica!" .mysql_error() ) ;
mysql_select_db( $database ) or die ( "Impossibile trova il database!" .mysql_error() ) ;
if ( mysql_select_db( $database ) )
{
$SQL = "SELECT name, point FROM records ORDER BY point LIMIT 10"
$result = mysql_query($SQL);
$i = 0 ;
while ( $db_field = mysql_fetch_assoc($result) )
{
echo '<p id="echo"' + $i '>' + db_field[ 'name' ] ; + '. . . . ' + db_field[ 'punti' ] + '</p>' ;
$i = $i + 1 ;
}
}
else
{
print "Database NOT Found ";
}
mysql_close( $connection );
?>
Ajax request(i cannot use jQuery)
function leaderboard( oggetto )
{
alert ( " PROVO A LANCIARE LA RICHIESTA PER LA CLASSIFICA " ) ;
// Ajax sinc.
var http_request = new XMLHttpRequest() ;
http_request.open( "GET" , "./PhpScript/read_from_db.php?", false ) ;
http_request.send( null ) ;
// Here will come the style settings later
alert( document.getElementById( "echo0" ) ) ;
return ;
}
I'll be glad to recive a solution with no refreshing page, or an alternative way to solve the problem, both without jquery because of the project specs.
The quoting in your echo statement is wrong:
echo '<p id="echo"' + $i '>' + db_field[ 'name' ] ; + '. . . . ' + db_field[ 'punti' ] + '</p>' ;
should be:
echo '<p id="echo' . $i '">' . db_field[ 'name' ] ; . '. . . . ' . db_field[ 'punti' ] + '</p>' ;
$i has to be inside the quotes around the ID. And the concatenation operator in PHP is ., not +.
From within my buddypress PHP templates I usually get the username of any given user by referencing the user ID like this:-
<?php echo bp_core_get_username( '{{userID}}' ) ?>
However I need to retrieve the username from within an external Javascript file.
The user ID is already passed in as var aData[11]. I have tried the following with no luck:-
$('td:eq(3)', nRow).html( '<div class="table-row"><h4 class="nomargin">' + aData[0] + '</h4>' + aData[1] + '</div>' );
I am trying to return a URL... This cirrently gives me:
http://www.mysite.com/members//song/?songsID=6
Whe it should be:
http://www.mysite.com/members/username/song/?songsID=6
Any ideas?
Edit: Below is the server side code that I am using to ouput the JSON
<?php
$aColumns = array( 'song_name', 'artist_band_name', 'author', 'song_artwork', 'song_file', 'genre', 'song_description', 'uploaded_time', 'emotion', 'tempo', 'songsID', 'user' );
$sIndexColumn = "songsID";
/* DB table to use */
$sTable = "wp_dbt_songs";
/* Database connection information */
$gaSql['user'] = "";
$gaSql['password'] = "";
$gaSql['db'] = "";
$gaSql['server'] = "";
$gaSql['link'] = mysql_pconnect( $gaSql['server'], $gaSql['user'], $gaSql['password'] ) or
die( 'Could not open connection to server' );
mysql_select_db( $gaSql['db'], $gaSql['link'] ) or
die( 'Could not select database '. $gaSql['db'] );
$sLimit = "";
if ( isset( $_GET['iDisplayStart'] ) && $_GET['iDisplayLength'] != '-1' )
{
$sLimit = "LIMIT ".mysql_real_escape_string( $_GET['iDisplayStart'] ).", ".
mysql_real_escape_string( $_GET['iDisplayLength'] );
}
if ( isset( $_GET['iSortCol_0'] ) )
{
$sOrder = "ORDER BY ";
for ( $i=0 ; $i<intval( $_GET['iSortingCols'] ) ; $i++ )
{
if ( $_GET[ 'bSortable_'.intval($_GET['iSortCol_'.$i]) ] == "true" )
{
$sOrder .= $aColumns[ intval( $_GET['iSortCol_'.$i] ) ]."
".mysql_real_escape_string( $_GET['sSortDir_'.$i] ) .", ";
}
}
$sOrder = substr_replace( $sOrder, "", -2 );
if ( $sOrder == "ORDER BY" )
{
$sOrder = "";
}
}
$sWhere = "";
if ( $_GET['sSearch'] != "" )
{
$sWhere = "WHERE (";
for ( $i=0 ; $i<count($aColumns) ; $i++ )
{
$sWhere .= $aColumns[$i]." LIKE '%".mysql_real_escape_string( $_GET['sSearch'] )."%' OR ";
}
$sWhere = substr_replace( $sWhere, "", -3 );
$sWhere .= ')';
}
/* Individual column filtering */
for ( $i=0 ; $i<count($aColumns) ; $i++ )
{
if ( $_GET['bSearchable_'.$i] == "true" && $_GET['sSearch_'.$i] != '' )
{
if ( $sWhere == "" )
{
$sWhere = "WHERE ";
}
else
{
$sWhere .= " AND ";
}
$sWhere .= $aColumns[$i]." LIKE '%".mysql_real_escape_string($_GET['sSearch_'.$i])."%' ";
}
}
$sQuery = "
SELECT SQL_CALC_FOUND_ROWS ".str_replace(" , ", " ", implode(", ", $aColumns))."
FROM $sTable
$sWhere
$sOrder
$sLimit
";
$rResult = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
/* Data set length after filtering */
$sQuery = "
SELECT FOUND_ROWS()
";
$rResultFilterTotal = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
$aResultFilterTotal = mysql_fetch_array($rResultFilterTotal);
$iFilteredTotal = $aResultFilterTotal[0];
/* Total data set length */
$sQuery = "
SELECT COUNT(".$sIndexColumn.")
FROM $sTable
";
$rResultTotal = mysql_query( $sQuery, $gaSql['link'] ) or die(mysql_error());
$aResultTotal = mysql_fetch_array($rResultTotal);
$iTotal = $aResultTotal[0];
$output = array(
"sEcho" => intval($_GET['sEcho']),
"iTotalRecords" => $iTotal,
"iTotalDisplayRecords" => $iFilteredTotal,
"aaData" => array()
);
while ( $aRow = mysql_fetch_array( $rResult ) )
{
$row = array();
for ( $i=0 ; $i<count($aColumns) ; $i++ )
{
if ( $aColumns[$i] == "version" )
{
/* Special output formatting for 'version' column */
$row[] = ($aRow[ $aColumns[$i] ]=="0") ? '-' : $aRow[ $aColumns[$i] ];
}
else if ( $aColumns[$i] != ' ' )
{
/* General output */
$row[] = $aRow[ $aColumns[$i] ];
}
}
$output['aaData'][] = $row;
}
echo json_encode( $output );
?>
The html you're setting is being set on the client side, not on the server side, meaning that the php code will not be evaluated.
I guess what you can do is either put the already-evaluated username in a hidden tag and get that using jquery or expose it to the javascript on the page within script tags.
EDIT: So is the userID or the username in the json as well? If not, you could probably put it there. I'm still not so sure what the situation is. But if you're currently passing the userID in the json and actually want the username as bp_core_get_username would return it, why not just put the already retrieved (with bp_core_get_username) username into the json as well?
In other words, in your php code, figure out what the username is based on the userid with bp_core_get_username and then pass that into the json. That is, if I'm understanding the situation correctly.