Import collection using button importing same collection multiple times

I’m learning postman, and I found it quite interesting!
Here, I have created one web page which is displaying some basic steps to import collection in my project.

        <div id="hiddenEnv" class="nodisplay highlight highlight-attention">
            <p>
                Click the button below to import into Postman
            </p>                    
            <p>                        
                <div class="postman-run-button"
                data-postman-action="collection/import"
                data-postman-var-1="abcd"></div>
                <script type="text/javascript">
                    (function (p,o,s,t,m,a,n) {
                        !p[s] && (p[s] = function () { (p[t] || (p[t] = [])).push(arguments); });
                        !o.getElementById(s+t) && o.getElementsByTagName("head")[0].appendChild((
                          (n = o.createElement("script")),
                          (n.id = s+t), (n.async = 1), (n.src = m), n
                        ));
                      }(window, document, "_pm", "PostmanRunObject", "https://run.pstmn.io/button.js"));
                </script>        
            </p>
        </div>

And Js code:

function generateUUID() {
    var d = new Date().getTime();
    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
        var r = (d + Math.random()*16)%16 | 0;
        d = Math.floor(d/16);
        return (c=='x' ? r : (r&0x3|0x8)).toString(16);
    });
    return uuid;
};

$(function(){
	
	var lastEnv;

	function newEnv(name){
		debugger;
		var env = {
			"id": generateUUID(),
			"name": "MyProject-" + name,
			"values": [
				{
					"key": "hostenv",
					"value": "",
					"type": "text",
					"enabled": true
				},
				{
					"key": "username",
					"value": "",
					"type": "text",
					"enabled": true
				},
				{
					"key": "password",
					"value": "",
					"type": "text",
					"enabled": true
				}
			],
			"timestamp": 1544608923,
			"synced": false,
			"syncedFilename": "",
			"team": null,
			"isDeleted": false
		};
		return env;
	}

	$('#enter-creds').on('click', function(ev){		
		var options = {
		    "name": "sampleBasicModal",
		    "content": $("script#envModal").html(),
		    onComplete: function(ev){
		    	console.log(ev);
		    	var modal = $(ev.currentTarget).closest('.modal');
		    	var form = modal.find('form');
		    	console.log(form);
		    			    	
		    	var formArr = form.serializeArray();

		    	var envName = _.find(formArr,{name: 'hostenv'}).value.split('.')[0];
				var envOutput = newEnv( envName );
				
				var formObj = {};
				
		    	formObj.hostenv = _.find(formArr,{name: 'hostenv'}).value;
		    	//formObj.apiVersion = _.find(formArr,{name: 'apiVersion'}).value;
		    	//formObj.clientId = _.find(formArr,{name: 'clientId'}).value;
		    	formObj.username = _.find(formArr,{name: 'username'}).value;
				formObj.password = _.find(formArr,{name: 'password'}).value;
				
				debugger;

		    	console.log(formObj);
		    	console.log(envOutput);

				
		    	if(!_pm('env.create', 'MyProject-' + envName, formObj)){
		    	 	_pm('env.replace', 'MyProject-' + envName, formObj); 
		    	} 

		    	lastEnv = envOutput;
		    	// $('#envDownload')[0].click();
		    	$('#shownEnv').remove();
		    	$('#hiddenEnv').slideDown(750);
		    }
		};
		var inst = Olive.modal.show(options);

		ev.preventDefault();
	});
});

But the issue is, when I click on button “open in postman windows” it created 7 to 8 copies of collection, i’m not sure where is the issue