Simple search parser

by meddario

HTML

<script src="https://code.jquery.com/jquery-3.3.1.js"></script>
<div class="parsed-input">
  <input type="text" id="search-box" value="my_key = My value">
  <button type="button" id="parse-input">
    Parse
  </button>
  <code class="parsed-input__output" id="output-box">

  </code>
</div>

CSS

.parsed-input__output {
  display: block;
  background-color: #eee;
  min-height: 200px;
}

JavaScript

const parseSearchString = (str) => {
  const components = str.split(',').map(c => c.trim())

  const result = {}

  components.forEach(component => {
    const [key, value] = component.split('=').map(c => c.trim())
    result[key.toLowerCase()] = value
  })

  return result
}


$(function() {
  var $input = $('#search-box')
  var $output = $('#output-box')
  var $parseInput = $('#parse-input')

  $parseInput.click(function() {
    $output.text(JSON.stringify(parseSearchString($input.val())))
  })
})