# responsive-menu/3.0.6/src/app/Form/HeaderBarOrdering.php

Responsive Menu – Create Mobile-Friendly Menu, version 3.0.6. 50 lines.

- Page: https://pluginprobe.com/plugins/responsive-menu/3.0.6/code/src/app/Form/HeaderBarOrdering.php
- Raw: https://pluginprobe.com/plugins/responsive-menu/3.0.6/raw/src/app/Form/HeaderBarOrdering.php
- Modified: 2016-06-21T17:18:08+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/responsive-menu/3.0.6/code/src/app/Form/HeaderBarOrdering.php#L10-L20`.

```php
<?php

namespace ResponsiveMenu\Form;
use ResponsiveMenu\Models\Option as Option;
use ResponsiveMenu\Form\FormComponent as FormComponent;

class HeaderBarOrdering implements FormComponent
{

	public function render(Option $option)
	{
    $required = ['logo' => '', 'title' => '', 'search' => '', 'html content' => '', 'button' => ''];
    $current_options = (array) json_decode($option->getValue());
    $all_options = array_merge($current_options, $required);

    echo '<ul id="header-bar-sortable">';
    foreach($all_options as $name => $val):
      $current_value = isset($current_options[$name]) ? $current_options[$name] : '';
      $on_class = $current_value == 'on' ? 'order-option-switch-on' : '';
      echo '<li class="draggable">'
              . ucwords($name)
              . '<input type="text" class="orderable-item" value="'.$current_value.'" name="menu['.$option->getName().']['.$name.']" />'
              . '<div class="order-option-switch ' . $on_class . '"></div>'
            . '</li>';
    endforeach;
    echo '</ul>';

    echo '<script>
      jQuery(document).ready(function($) {
        $(document).on("click", ".order-option-switch", function() {
          if($(this).siblings("input.orderable-item").val() != "on") {
            console.log($(this));
            $(this).siblings("input.orderable-item").val("on");
            $(this).addClass("order-option-switch-on");
          } else {
            $(this).siblings("input.orderable-item").val("");
            $(this).removeClass("order-option-switch-on");
          }
        });
        $( "#header-bar-sortable" ).sortable({
          revert: true
        });
        $( "#sortable, .draggable" ).disableSelection();
      });
    </script>';

	}

}

```