---
title: Validate JSON
type: plugins
category: Validation
cat: validation
order: 100
meta_title: Validate JSON
meta_description: Checks that the introduced text is a valid JSON
tier: enterprise
---



!!! note
     For information about modifying this plugin or creating your own custom plugins, see [Customize and Build Your Own Plugins](custom).

     For general plugin information, see [Plugins for projects](/guide/plugins) and [Plugin FAQ](faq).

## About
This plugin parses the contexts of a `TextArea` field to check for valid JSON. If the JSON is invalid, it shows an error and prevents the annotation from being saved.

This is an example of a "hard" block, meaning that the user must resolve the issue before they can proceed. 

![Screenshot of JSON error message](/images/plugins/json-validate.png)

## Plugin

```javascript
 LSI.on("beforeSaveAnnotation", (store, annotation) => {
  const textAreaResult = annotation.results.find(r => r.type === 'textarea' && r.from_name.name === 'answer');
  if (textAreaResult) {
    try {
      JSON.parse(textAreaResult.value.text[0]);
    } catch (e) {
      Htx.showModal("Invalid JSON format. Please correct the JSON and try again.", "error");
      return false;
    }
  }
  return true;
});
```

**Related LSI instance methods:**

* [on(eventName, handler)](custom#LSI-on-eventName-handler)

**Related frontend events:**

* [beforeSaveAnnotation](/guide/frontend_reference#beforeSaveAnnotation)


## Labeling config

```xml

  
    
    
      
      
      
      
    
  
  
    
  
  
      </View>
</View>
```

**Related tags:**

* [View](/tags/view.html)
* [RectangleLabels](/tags/rectanglelabels.html)
* [TextArea](/tags/textarea.html)
* [Labels](/tags/labels.html)

## Sample data

```json
[
  {
    "image": "<a href="https://labelstud.io/demo/Datasets/Image/Object">https://labelstud.io/demo/Datasets/Image/Object</a> Detection/Image_66.jpg"
  }
]
```
</pre></div>
</div>
</div>






		</div>
		
		
		
        

        

        

        
    
		

		
				
	
	
	
	
	<!-- user fragment -->
	

	
	

		
		<!-- page footer -->
		<div class="container">
			<footer class="footer">
				<p class="pull-right">
					<a title="gitblit homepage" href="http://gitblit.com/">
						<span>v1.9.3</span>
					</a> 
				</p>
			</footer>
		</div>

		<!-- Override Bootstrap's responsive menu background highlighting -->
		<style>
		@media (max-width: 979px) {
			.nav-collapse .nav > li > a:hover, .nav-collapse .dropdown-menu a:hover {
				background-color: #002060;
			}
			
			.navbar div > ul .dropdown-menu li a {
				color: #ccc;
			}
		}
		</style>
		
		<!-- Include scripts at end for faster page loading -->
		<script type="text/javascript" src="../../../bootstrap/js/jquery.js"></script>
		<script type="text/javascript" src="../../../bootstrap/js/bootstrap.js"></script>	
		<script type="text/javascript" src="../../../gitblit/js/collapsible-table.js"></script>
		
	</body>
</html>