CODEWITHSUNDEEP
javascriptjqueryregexjson
dvlden
dvlden

Reputation: 2462

Remove white space from JSON object, but not within quotes

So I have an input[type="text"], where I want to paste JSON object as configuration. Output in console is perfect, all inline without any trimming, but now in that input I have lots of spacing. I'd like to get rid of that spacing and replace the input value.

Example

$('#widget-json').on('input propertychange', function () {
    var string = this.value.replace(/\s+/g, ''),
        data = $.parseJSON( string );

    $(this).val( string );
});

That almost do the job, but it also removes spacing within quotes. So if I had a key/val like "sentence": "Sure thing, good to go.", that would get converted into "sentence":"Surething,goodtogo.", while I'd want to preserve spacing within quotes.

JSON Object Example

{
    "widget-effect": 3,
    "widget-opacity-color": "#C7C9CF",
    "widget-opacity-slider": "50%",
    "widget-opt-close": false,
    "widget-opt-scroll": true,
    "widget-opt-totop": true,
    "widget-text": "Spacing required within quotes"
}

Desired Output Example

{"widget-effect":3,"widget-opacity-color":"#C7C9CF","widget-opacity-slider":"50%","widget-opt-close":false,"widget-opt-scroll":true,"widget-opt-totop":true,"widget-text": "Spacing required within quotes"}

I am assuming that that regex could be fitted to skip replacing spacing inside of quotes, but I'm not really familiar with it at all.

Upvotes: 6

Views: 15480

Answers (2)

Avinash Raj
Avinash Raj

Reputation: 174706

Use regex alternation operator.

var s = '"sentence": "Sure thing, good to go."';
alert(s.replace(/("[^"]*")|\s/g, "$1"))

What actually the above regex do?

  • ("[^"]*") captures all the double quoted blocks. So in the above, "sentence" and "Sure thing ..." are captured (means this particular part would be stored into a temp buffer of index 1).

  • | OR

  • \s matches all the space characters from the remaining string. So it won't touch the previous matched parts.

  • $1 in the replacement part refers all the chars which are captured by the first capturing group. So chars in the first capturing groups are retained and the matched spaces got removed.

Update:

Unfortunately, when you escape a quote in the value of the string the regex breaks and stops removing spaces for the remaining key/value pairs

var stri = `"sentence \\"with escaped quotes\\" should not break": "Sure thing, good to go."`;
alert(stri.replace(/("(?:\\"|[^"])*")|\s/g, "$1"));

Upvotes: 14

guest271314
guest271314

Reputation: 1

Try utilizing JSON.stringify

$("#widget-json").on("input propertychange", function () {
    // var string = this.value.replace(/\s+/g, ''),
    var data = JSON.stringify($.parseJSON( this.value ));
    $(this).val( data );
});


var data = {
    "widget-effect": 3,
    "widget-opacity-color": "#C7C9CF",
    "widget-opacity-slider": "50%",
    "widget-opt-close": false,
    "widget-opt-scroll": true,
    "widget-opt-totop": true,
    "widget-text": "Spacing required within quotes"
};

document.write(JSON.stringify(data));

Upvotes: 3

Related Questions