drupal 6 custom menu attributes for jquery mobile

I am trying to create a drupal 6 menu tree with additional attributes to make use of jquerymobile themeing, but drupal always gives me a blank WSOD whenever I tried to place additional attribute with a hypen in it which are common for jquerymobile.

  $primary_tree = menu_tree(variable_get('menu_primary_links_source', 'primary-links')); 
  //Trying to add attributes into the array below always fails: data-role="listview" data-inset="true" data-theme="a"
  $vars['main_menu_links_tree'] = preg_replace('/^<ul class="menu/i', '<ul id="main-menu" class="main-menu clearfix', $primary_tree, 1); 

My expected output will be:

  <ul id="mai开发者_Go百科n-menu" class="main-menu" data-role="listview" data-inset="true" data-theme="a">
   .............
  </ul>

The link to jquerymobile: http://jquerymobile.com/demos/1.0a1/#docs/about/../lists/lists-themes.html

Any hint would be very much appreciated. Thanks

A simple solution to this would be to change your page.tpl

e.g in Garland

<?php if (isset($primary_links)) : ?>
  <?php print theme('links', $primary_links, array('class' => 'links primary-links')) ?>
<?php endif; ?>

will change to

<?php if (isset($primary_links)) : ?>
  <?php 
    print theme('links', $primary_links, 
            array(
             'class' => 'main-menu',
             'id' => 'main-menu',
             'data-role' => 'listview',
             'data-inset' => 'true',
             'data-theme' => 'a'
            )
          )
  ?>
<?php endif; ?>