napalm-hpe-officeconnect/tests/fixtures/switching_vlan_per_port_1.html

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- Copyright &copy; 2017-2022 Hewlett Packard Enterprise Development LP. -->
<html>

<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>VLAN Port Membership</title>
<link rel="shortcut icon" href="/htdocs/login/favicon.ico?">
<link type="text/css" media="screen" rel="stylesheet" href="/htdocs/static/bt1707389424/css/jquery-ui-1.12.1.custom.css">
<link type="text/css" media="screen" rel="stylesheet" href="/htdocs/static/bt1707389424/jquery/datatables_1_9_4/css/jquery.dataTables_themeroller.css">
<link type="text/css" media="screen" rel="stylesheet" href="/htdocs/static/bt1707389424/css/style_datatables_custom.css">
<link type="text/css" media="screen" rel="stylesheet" href="/htdocs/static/bt1707389424/css/style_common_pages.css">
<link type="text/css" media="screen" rel="stylesheet" href="/htdocs/static/bt1707389424/css/tabs.css">
<!--[if ie 7]>
<link rel="stylesheet" href="/htdocs/static/bt1707389424/css/style_browser_fixups_ie7.css" type="text/css">
<![endif]-->
<!--[if gte ie 7]>
<link rel="stylesheet" href="/htdocs/static/bt1707389424/css/style_browser_fixups_ie7plus.css" type="text/css">
<![endif]-->
<script type="text/javascript" src="/htdocs/static/bt1707389424/jquery/jquery_3_5_1/jquery-3.5.1.min.js"></script>
<script type="text/javascript" src="/htdocs/static/bt1707389424/jquery/jquery_ui_1_12_1/jquery-ui-1.12.1.min.js"></script>
<script type="text/javascript" src="/htdocs/static/bt1707389424/jquery/datatables_1_9_4/jquery.dataTables.min.js"></script>
</head>

<body class="ui-state-default fp_jqtds_page_body fp_corner_bottom">
<a name="focus_top" id="focus_top"></a>

<div id="fp_div_page_title_bar" class="fp_jqtds_h1">
<div id="fp_div_page_title_text">VLAN Port Membership</div>&nbsp;
<div id="fp_div_title_bar_tooltip">
<a class="fp_anchor_tooltip" href="/htdocs/lang/en_us/help/switching/help_vlan_per_port.lsp" target="_blank">
<img src="/htdocs/static/bt1707389424/images/icon_help_black24-helpText.png" title="Help" alt="Help" border="0">
</a>
</div><!-- fp_div_title_bar_tooltip -->
</div><!-- fp_div_page_title_bar -->

<div class="fp_page_container">

<form id="form1" name="form1" method="post" action="/htdocs/pages/switching/vlan_per_port.lsp">

<div class="fp_sub_container">
<table id="fp_page_table_content" cellpadding="0" cellspacing="0">
<tbody>

<tr>  <!-- VLAN ID -->
<td class="ui-widget-content fp_data_label">VLAN ID</td>
<td class="ui-widget-content fp_data_value" id="vlan">
<select name="vlan_sel[]" id="vlan_sel" onchange="selector_change(this);">
<option id="vlan_sel_1" value="1" selected="selected">1</option>
<option id="vlan_sel_10" value="10">10</option>
<option id="vlan_sel_20" value="20">20</option>
<option id="vlan_sel_30" value="30">30</option>
<option id="vlan_sel_40" value="40">40</option>
<option id="vlan_sel_50" value="50">50</option>
<option id="vlan_sel_60" value="60">60</option>
</select>
</td>
</tr>

</tbody>
</table>
</div> <!-- fp_sub_container -->

<hr class="first"></hr>
<div class="fp_sub_container">
<div id="dynamic_dt1"></div>
</div> <!-- fp_sub_container -->

<div id="page_buttons" class="fp_button_row">
<input class="fp_button ui-button ui-widget ui-state-default fp_primary_button" type="submit" id="b_form1_refresh" name="b_form1_refresh" value="Refresh" onclick="jslib_b_pressed_g='refresh';">
&nbsp;
<input class="fp_button ui-button ui-widget ui-state-default fp_dt_button" type="button" id="b_form1_dt_remove" name="b_form1_dt_remove" value="Edit" >
&nbsp;
<input class="fp_button ui-button ui-widget ui-state-default fp_dt_button" type="button" id="b_form1_dt_add" name="b_form1_dt_add" value="Edit All" >
</div> <!-- fp_button_row -->

</form> <!-- form1 -->

</div><!-- fp_page_container -->

<script type="text/javascript" language="JavaScript">
<!--
  var jslib_msgs = parent.jslib_msgs_tbl;
-->
</script>
<script type="text/javascript" src="/htdocs/static/bt1707389424/js/web-utils-combo.js"></script>
<script type="text/javascript" src="/htdocs/static/bt1707389424/jquery/plugins/jquery-plugins-combo.js"></script>
<script type="text/javascript" src="/htdocs/static/bt1707389424/jquery/datatables_1_9_4/jquery.dataTables-plugins.js"></script>
<script type="text/javascript" src="/htdocs/lang/en_us/culture/globalize.culture.en-US.20120606.js"></script>

<script type="text/javascript" language="JavaScript">
<!--

var aDataSet = [
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_1" value="1"><label></label>', '1', 'Untagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_2" value="2"><label></label>', '2', 'Excluded']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_3" value="3"><label></label>', '3', 'Excluded']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_4" value="4"><label></label>', '4', 'Excluded']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_5" value="5"><label></label>', '5', 'Untagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_6" value="6"><label></label>', '6', 'Excluded']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_7" value="7"><label></label>', '7', 'Untagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_8" value="8"><label></label>', '8', 'Tagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_54" value="54"><label></label>', 'TRK1', 'Untagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_55" value="55"><label></label>', 'TRK2', 'Untagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_56" value="56"><label></label>', 'TRK3', 'Untagged']
,
['<input type="checkbox" class="chkrow" name="chkrow[]" id="chkrow_57" value="57"><label></label>', 'TRK4', 'Untagged']
];

  var aColumns = [
    { "sTitle": '<input type="checkbox" class="chkall" name="chkall" id="chkall" value="chkall"><label></label>',   "bSearchable": false, "bSortable": false, "sWidth": "2%" },
    { "sTitle": "Interface",     "sType": "intf-sort" },
    { "sTitle": "Participation/Tagging",       "sType": "html" }
  ];

// Select list onchange handler (client-side)
function selector_change(field)
{
  field.form.submit();
}

// Edit button query string callback function
// This function name is specified as the 'fn' parameter on 'modal_button_attrib' for the 'edit' button
function fnEdit()
{
  var qString = '';
  var intfStr = [];

  $(".chkrow:checked").each(function(idx) {
    intfStr[idx] = $(this).val();
  });

  qString = '?vlan='+$("#vlan_sel option:selected").val() + '&intfStr='+intfStr;
  return qString;
}

// Edit All button query string callback function
// This function name is specified as the 'fn' parameter on 'modal_button_attrib' for the 'editAll' button
function fnEditAll()
{
  return '?vlan='+$("#vlan_sel option:selected").val() + '&intfStr=all';
}

$(document).ready( function ()
{
  // Define datatable
  $('#dynamic_dt1').html( '<table cellpadding="0" cellspacing="0" border="0" class="display" id="sorttable1"><\/table>' );
  fp_dt_create("#sorttable1", { aaData: aDataSet, aoColumns: aColumns, dt_btn: true, multi_select: true, rw: true });

    var val = 0;
  if ((val != 0) || (false == true))
  {
    $("#b_form1_dt_add").button("disable");
  }
});

-->
</script>

<script type="text/javascript" language="JavaScript">
<!--
$(document).ready( function()
{
  var page_is_valid = true;

  // format all culture-specific elements using the current locale
  culture_format(parent.culture);

  
    var myNav = navigator.userAgent.toLowerCase();
    var isIe = false;
    if (myNav.indexOf('msie') != -1)
    {
      var myVer = parseInt(myNav.split('msie')[1]);
    }
    
    if ((isIe == true) && (myVer < 8)) {
    $('input[type=radio],[type=checkbox]').live('click', function () {
      this.blur();
      this.focus();
    });
  }

  $(':input').bind('keypress', function(e) {
    var key = (window.event) ? window.event.keyCode : e.which;  // IE vs. FF
    var $this = $(this);
    if ( ($this.is(':not(:button, :submit, :reset, textarea)')) ) {
      return (key != 13);
    }
  });

  $(".fp_button").button();
    $(".fp_button_cancel").button();

  $('form input[type="reset"]').click(function(e) {
   if( $('#sorttable1').length ){
    fp_dt_reset_handler("#sorttable1"); 
   }
    return jslib_form_reset(this.form);
  });

  $(":submit,:button").click(function(e) {
    // remember which button was clicked last by storing into hidden field
    var button = $(this).attr("id");
    var form_id = $(e.target).closest("form").attr("id");
    if (form_id)
    {
      $("#b_"+form_id+"_clicked").val(button);
    }
    page_is_valid = jslib_form_validate(document.forms[0]);

    return page_is_valid;
  });

  // add a hidden field to each form to record which submit button
  // was clicked so that it gets presented in the POST data
  $("form").each(function() {
    var $this = $(this);
    var bid = "b_" + $this.attr("id") + "_clicked";
    var b_clicked = '<input type="hidden" id="' + bid + '" name="' + bid + '">';
    $(b_clicked).appendTo($this);
  });
  // Bind to the click event for all the matching 'b_form1_dt_remove' buttons to open a page as a modal dialog
  $('[id*="b_form1_dt_remove"]').click( function() {
    var qStr = fnEdit();
    main_modal_page_open('/htdocs/pages/switching/vlan_per_port_modal.lsp' + qStr, 'Edit VLAN Port Membership', '750', '380', {  btnPost : "Apply", btnClose : "Cancel" } );
  });

  // Bind to the click event for all the matching 'b_form1_dt_add' buttons to open a page as a modal dialog
  $('[id*="b_form1_dt_add"]').click( function() {
    var qStr = fnEditAll();
    main_modal_page_open('/htdocs/pages/switching/vlan_per_port_modal.lsp' + qStr, 'Edit VLAN Port Membership', '750', '360', {  btnPost : "Apply", btnClose : "Cancel" } );
  });

  $(window).resize(function() {
    if(this.resizeTO) clearTimeout(this.resizeTO);
    this.resizeTO = setTimeout(function() {
      $(this).trigger('resizeEnd');
      }, 500);
  });
  $(window).bind('resizeEnd', function() {
      iframe_auto_resize();
  });
  iframe_auto_resize();
  $('form input[type="submit"]').click(function(e) {
    var form_id = $(e.target).closest("form").attr("id");
    var f_s = "b_"+form_id+"_submit";
    var f_r = "b_"+form_id+"_refresh";
    var f_click = $("#b_"+form_id+"_clicked").val();
    if (((f_click == f_s) || (f_click == f_r)) && page_is_valid)
    {
      parent.progress_modal_open();
    }
  });
  parent.progress_modal_handler(parent.ple.PAGE_LOADED);

  focus_init("focus_top");
});
-->
</script>

</body>
</html>