{"id":10614,"date":"2022-04-28T20:50:14","date_gmt":"2022-04-28T18:50:14","guid":{"rendered":"http:\/\/tag-it.nu\/?page_id=10614"},"modified":"2022-04-28T20:59:17","modified_gmt":"2022-04-28T18:59:17","slug":"tag-form","status":"publish","type":"page","link":"https:\/\/tag-it.nu\/en\/tag-form\/","title":{"rendered":"tag-form"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"10614\" class=\"elementor elementor-10614\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9aa2837 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9aa2837\" data-element_type=\"section\">\r\n\t\t\r\n\t\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\r\n\t\t\t\t\t\t\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-4f557c4\" data-id=\"4f557c4\" data-element_type=\"column\">\r\n\t\t\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\r\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5336570 elementor-widget elementor-widget-shortcode\" data-id=\"5336570\" data-element_type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\r\n    \r\n      <div id=\"app\">\r\n        <div style=\"display: flex;\">\r\n            <input v-model=\"tagId\" placeholder=\"Skriv m\u00e6rkers ID nummer her:\" style=\"\t\t\tfont-size: 16px;    \t\t\tmin-height: 47px;    \t\t\tpadding: 6px 16px;    \t\t\tborder-radius: 4px;\t\t\tcolor: #7A7A7A;\t\t\twidth: 100%;    \t\t\tmax-width: 100%;    \t\t\tborder: 1px solid #818a91;\t\t\tvertical-align: middle;\t\t\" \/>\r\n\r\n            <button type=\"button\" style=\"\t\t\tfont-family: Poppins, Open Sans;    \t\t\tfont-size: 16px;    \t\t\tfont-weight: 600;    \t\t\ttext-transform: uppercase;    \t\t\ttext-decoration: none;    \t\t\tline-height: 16px;    \t\t\tborder-radius: 5px 5px 5px 5px;\t\t\tmargin-left: 15px;\t\t\tbackground-color: #ff458c;\t\t\tcolor: #fff;\t\t\tborder: none;\t\t\tpadding: 15px 30px;\t\t\" v-on:click=\"showPopup\">\r\n\t\tGo!\r\n\t\t<\/button>\r\n\r\n\r\n            <div class=\"modal fade\" id=\"exampleModal\" tabindex=\"-1\" aria-labelledby=\"exampleModalLabel\" aria-hidden=\"true\">\r\n                <div class=\"modal-dialog modal-lg modal-dialog-centered\">\r\n                    <div class=\"modal-content\">\r\n                        <div class=\"modal-header\">\r\n                            <h5 class=\"modal-title\" id=\"exampleModalLabel\">{{modalTitle}}<\/h5>\r\n\r\n                            <button type=\"button\" class=\"close\" data-dismiss=\"modal\" v-on:click=\"closepopup\" aria-label=\"Close\">\r\n                            <span aria-hidden=\"true\">&times;<\/span>\r\n                        <\/button>\r\n                        <\/div>\r\n                        <div class=\"modal-body\" style=\"min-height: 200px;\">\r\n\r\n                            <div class=\"container-fluid\">\r\n                                <div class=\"row justify-content-center\">\r\n                                    <div class=\"col-11 col-sm-9 col-md-7 col-lg-6 col-xl-5 text-center p-0 mt-3 mb-2\">\r\n                                        <div v-if=\"!isLoading\" class=\"card px-0 pt-4 pb-0 mt-3 mb-3\">\r\n                                            <!--<h2 id=\"heading\">Sign Up Your User Account<\/h2>\r\n                                        <p>Fill all form field to go to next step<\/p>-->\r\n                                            <!-- Show Register tag form -->\r\n\r\n\r\n\r\n                                            <form v-show=\"tagStatus === 'unregistered'\" id=\"msform\" action=\"\">\r\n                                                <div v-show=\"isAuth == false\">\r\n                                                    <fieldset v-if=\"!isAuth\">\r\n                                                        <div class=\"form-card\">\r\n\r\n\r\n                                                            <h2> Login <\/h2>\r\n\r\n                                                            <span v-show=\"modeIsLogin == false\"><label class=\"fieldlabels\">FirstName <\/label> \r\n                                                    <input v-model=\"tagUser.Name\" v-bind:name=\"tagUser.Name\" type=\"text\"\/><\/span>\r\n\r\n                                                            <span v-show=\"modeIsLogin == false\"><label class=\"fieldlabels\">LastName <\/label> \r\n                                                    <input v-model=\"tagUser.LastName\" v-bind:name=\"tagUser.LastName\" type=\"text\"\/><\/span>\r\n\r\n                                                            <span><label class=\"fieldlabels\">Username <\/label> \r\n                                                    <input v-model=\"tagUser.Email\" required v-bind:name=\"tagUser.Email\" type=\"text\"\/><\/span>\r\n\r\n                                                            <span><label class=\"fieldlabels\">Password <\/label> \r\n                                                    <input v-model=\"tagUser.Password\" v-bind:name=\"tagUser.Password\" type=\"text\"\/><\/span>\r\n\r\n\r\n                                                        <\/div>\r\n\r\n\r\n                                                        <input type=\"button\" name=\"next\" class=\"next action-button\" value=\"Next\" \/>\r\n                                                        <button type=\"button\" v-on:click=\"goToRegister\">Register<\/button>\r\n                                                    <\/fieldset>\r\n                                                <\/div>\r\n\r\n\r\n                                                <div v-show=\"isAuth == true\">\r\n\r\n                                                    <!-- progressbar -->\r\n                                                    <ul id=\"progressbar\">\r\n                                                        <li v-for=\"(item, index) in flowData\" v-bind:class=\"index == current || index == 0 ? 'active' : ''\" id=\"account\"><strong>Step {{index + 1}}<\/strong><\/li>\r\n\r\n                                                    <\/ul>\r\n                                                    <div class=\"progress\">\r\n                                                        <div class=\"progress-bar progress-bar-striped progress-bar-animated\" role=\"progressbar\" aria-valuemin=\"0\" aria-valuemax=\"100\"><\/div>\r\n                                                    <\/div> <br>\r\n                                                    <!-- fieldsets -->\r\n\r\n\r\n\r\n\r\n                                                    <fieldset v-for=\"(item, index) in flowData\">\r\n                                                        <div class=\"form-card\" :id=\"'uiform' + index\">\r\n\r\n\r\n                                                            <!--<label class=\"fieldlabels\">Username: *<\/label> <input type=\"text\" name=\"uname\" placeholder=\"UserName\" \/>-->\r\n\r\n\r\n                                                            <dynamic-control v-for=\"c in item.fields\" v-bind:control=\"c\"><\/dynamic-control>\r\n\r\n                                                        <\/div>\r\n\r\n                                                        <input id=\"uifinish\" type=\"button\" v-if=\"index == (flowData.length - 1)\" :data-parentform=\"'uiform' + index\" name=\"uifinish\" class=\"action-button\" value=\"Finish\" \/>\r\n                                                        <input v-if=\"index < (flowData.length - 1)\" type=\"button\" :data-parentform=\"'uiform' + index\" name=\"next\" class=\"next action-button\" value=\"Next\" \/>\r\n                                                        <input v-if=\"index > 0\" type=\"button\" name=\"previous\" class=\"previous action-button-previous\" value=\"Previous\" \/>\r\n\r\n                                                    <\/fieldset>\r\n\r\n                                                <\/div>\r\n\r\n\r\n                                            <input type=\"hidden\" name=\"trp-form-language\" value=\"en\"\/><\/form>\r\n\r\n                                            <!-- Show missing tag contact form -->\r\n\r\n                                            <div v-show=\"tagStatus === 'missing'\">\r\n\r\n                                                <h3>Contact the owner<\/h3>\r\n\r\n\r\n                                                <div>\r\n                                                    <div class=\"form-group required-field\">\r\n                                                        <label for=\"contact-name\">Name<\/label>\r\n                                                        <input type=\"text\" v-model=\"msg.Name\" v-bind:name=\"msg.Name\" class=\"form-control\" id=\"contact-name\" name=\"contact-name\" required=\"\">\r\n                                                    <\/div>\r\n                                                    <!-- End .form-group -->\r\n\r\n                                                    <div class=\"form-group required-field\">\r\n                                                        <label for=\"contact-email\">Email<\/label>\r\n                                                        <input type=\"email\" v-model=\"msg.Email\" v-bind:name=\"msg.Email\" class=\"form-control\" id=\"contact-email\" name=\"contact-email\" required=\"\">\r\n                                                    <\/div>\r\n                                                    <!-- End .form-group -->\r\n                                                    <!-- End .form-group -->\r\n\r\n                                                    <div class=\"form-group required-field\">\r\n                                                        <label for=\"contact-message\">Message<\/label>\r\n                                                        <textarea cols=\"30\" rows=\"3\" v-model=\"msg.Message\" v-bind:name=\"msg.Message\" id=\"contact-message\" class=\"form-control\" name=\"contact-message\" required=\"\"><\/textarea>\r\n                                                    <\/div>\r\n                                                    <!-- End .form-group -->\r\n\r\n                                                    <div class=\"form-footer\">\r\n                                                        <div id=\"uimsgerror\" v-if=\"msgSent =='failed'\" class=\"alert alert-danger alert-intro\" role=\"alert\">\r\n                                                            Message not sent\r\n                                                        <\/div>\r\n\r\n                                                        <div id=\"uimsgerror\" v-if=\"msgSent =='success'\" class=\"alert alert-success alert-intro\" role=\"alert\">\r\n                                                            Message send successfully\r\n                                                        <\/div>\r\n                                                        <input type=\"hidden\" v-model=\"msg.TagId\" v-bind:name=\"msg.TagId\">\r\n                                                        <button id=\"uibuttonsendmessage\" type=\"button\" v-on:click=\"sendMessage\" class=\"btn btn-primary\">Send<\/button>\r\n                                                    <\/div>\r\n                                                    <!-- End .form-footer -->\r\n                                                <\/div>\r\n\r\n                                            <\/div>\r\n\r\n                                            <div v-show=\"tagStatus === 'unknown'\">\r\n                                                <h3>Unknown tag<\/h3>\r\n                                            <\/div>\r\n\r\n                                            <div v-show=\"tagStatus === 'error'\">\r\n                                                <h3>Something went wrong. Please try again.<\/h3>\r\n                                            <\/div>\r\n\r\n                                        <\/div>\r\n                                    <\/div>\r\n                                <\/div>\r\n                            <\/div>\r\n                            <div v-if=\"isLoading\" class=\"loading\">Loading&#8230;<\/div>\r\n\r\n\r\n                        <\/div>\r\n                        <div class=\"modal-footer\">\r\n                            <!--<button type=\"button\" class=\"btn btn-secondary\" data-dismiss=\"modal\">Close<\/button>\r\n                    <button type=\"button\" class=\"submit btn btn-primary\">Save changes<\/button>-->\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n\r\n    <\/div>\r\n\r\n\r\n\r\n    <script>\r\n        Vue.component('dynamicControl', {\r\n            props: ['control'],\r\n            data() {\r\n                return {\r\n                    count: 0\r\n                }\r\n            },\r\n            template: `<p v-if=\"control.fieldType === 'label'\"> {{control.fieldValue}} <\/p>\r\n                        <span v-else-if=\"control.fieldType === 'string'\"><label class=\"fieldlabels\" v-bind:class=\"[control.fieldName === 'uifirstname' ? 'hide' : '']\">{{control.uniqueLabel}}: <\/label> <input type=\"text\" v-model=\"control.fieldValue\" v-bind:name=\"control.fieldName\" :id=\"control.fieldName\" :required=\"control.isRequired\" v-bind:class=\"[control.fieldName === 'uifirstname' ? 'hide' : '']\" \/><\/span>\r\n                        <span v-else-if=\"control.fieldType === 'number'\"><label class=\"fieldlabels\" v-bind:class=\"[control.fieldName === 'uifirstname' ? 'hide' : '']\">{{control.uniqueLabel}}: <\/label><input type=\"number\" v-model=\"control.fieldValue\" v-bind:name=\"control.fieldName\" :id=\"control.fieldName\" :required=\"control.isRequired\" v-bind:class=\"[control.fieldName === 'uifirstname' ? 'hide' : '']\" \/><\/span>\r\n                        <span v-else-if=\"control.fieldType === 'bool'\"><label class=\"fieldlabels\">{{control.uniqueLabel}}: <\/label> <input type=\"checkbox\" v-model=\"control.fieldValue\" :required=\"control.isRequired\" name=\"{{control.fieldName}}\" \/><\/span>\r\n                        `\r\n        })\r\n\r\n        window.$ = jQuery;\r\n        var app = new Vue({\r\n            el: '#app',\r\n            data: {\r\n                message: 'Hello Vue!',\r\n                flowData: [],\r\n                stepCount: 0,\r\n                isAuth: false,\r\n                tagId: \"AA5027379437\",\r\n                apiBaseUrl: \"http:\/\/app.maerk-din-cykel.dk\/\",\r\n                \/\/apiBaseUrl: \"https:\/\/localhost:44338\/\",\r\n                modeIsLogin: true,\r\n                isLoading: false,\r\n                msgSent: \"\",\r\n                tagStatus: \"\",\r\n                modalTitle: \"Looking up tag..\",\r\n                tagUser: {\r\n                    Name: \"\",\r\n                    LastName: \"\",\r\n                    Email: \"test15@test.com\",\r\n                    Password: \"Izarband123\"\r\n                },\r\n                msg: {\r\n                    TagId: \"\",\r\n                    Name: \"\",\r\n                    Email: \"\",\r\n                    Phone: \"\",\r\n                    Message: \"\"\r\n                }\r\n            },\r\n            mounted: function() {\r\n\r\n\r\n                \/\/ this.initWizard();\r\n                \/* this.isAuthenticated();*\/\r\n            },\r\n\r\n\r\n            methods: {\r\n\r\n                goToRegister: function() {\r\n\r\n                    this.modeIsLogin = !this.modeIsLogin;\r\n\r\n                },\r\n                showPopup: async function() {\r\n\r\n                    this.isLoading = true;\r\n                    await this.loadFlowData();\r\n\r\n                },\r\n                closepopup: async function() {\r\n                    $('#exampleModal').modal(\"hide\")\r\n                },\r\n                sendMessage: async function() {\r\n\r\n                    this.msg.TagId = this.tagId;\r\n                    const res = await fetch(this.apiBaseUrl + \"api\/tagit\/sendtagmessage\", {\r\n                        method: \"POST\",\r\n                        headers: {\r\n                            \"Accept\": 'application\/json',\r\n                            \"Content-Type\": 'application\/json'\r\n                        },\r\n                        body: JSON.stringify(this.msg),\r\n                    });\r\n                    if (res.status == 401) {\r\n                        console.log(\"msg sent failed\")\r\n                        this.msgSent = \"failed\";\r\n                    }\r\n                    if (res.status == 200) {\r\n\r\n                        console.log(\"msg sent\")\r\n                        this.msgSent = \"success\";\r\n                        this.msg.Name = \"\";\r\n                        this.msg.Email = \"\";\r\n                        this.msg.Message = \"\";\r\n\r\n                    } else {\r\n                        this.msgSent = \"failed\";\r\n                    }\r\n\r\n                },\r\n                isAuthenticated: async function() {\r\n\r\n                    try {\r\n                        const token = localStorage.getItem(\"auth_token\");\r\n\r\n                        var bearer = 'Bearer ' + token;\r\n\r\n\r\n                        const res = await fetch(this.apiBaseUrl + \"api\/auth\/getauth\", {\r\n                            headers: {\r\n                                Authorization: bearer\r\n                            }\r\n                        });\r\n                        if (res.status == 401 || res.status == 404) {\r\n                            return this.isAuth = false;\r\n                        } else if (res.status == 200) {\r\n\r\n                            return this.isAuth = true;\r\n                        }\r\n                        console.log(res);\r\n\r\n                    } catch (e) {\r\n\r\n                        return this.isAuth = false;\r\n                        const err = e;\r\n                    }\r\n\r\n                },\r\n                loadFlowData: async function() {\r\n\r\n                    this.isLoading = true;\r\n                    $('#exampleModal').modal(\"show\")\r\n\r\n                    this.flowData = [];\r\n\r\n                    let au = await this.isAuthenticated();\r\n\r\n                    try {\r\n\r\n\r\n                        const response = await fetch(this.apiBaseUrl + \"api\/tagit\/getwizardflow\/?tagId=\" + this.tagId + \"&isAuth=\" + au);\r\n\r\n                        this.isLoading = false;\r\n                        if (response.status == 200) {\r\n                            const data = await response.json();\r\n                            this.flowData = data;\r\n                            this.stepCount = this.flowData.lenght + 1;\r\n                            this.tagStatus = \"unregistered\";\r\n                            setTimeout(async() => {\r\n                                this.initWizard();\r\n\r\n                            }, 500);\r\n\r\n                            this.modalTitle = \"Register tag\";\r\n                        }\r\n\r\n                        if (response.status == 409) {\r\n\r\n                            this.tagStatus = \"missing\";\r\n                            this.modalTitle = \"Send message\";\r\n                            console.log(\"Tag already registered\")\r\n                        }\r\n\r\n                        if (response.status == 404) {\r\n\r\n                            this.tagStatus = \"unknown\";\r\n                            console.log(\"No tag found\")\r\n                        }\r\n\r\n                    } catch (error) {\r\n\r\n                        this.tagStatus = \"error\";\r\n                        console.log(\"Error finding tag\")\r\n                        this.isLoading = false;\r\n                    }\r\n\r\n                },\r\n                registerMember: async function() {\r\n\r\n                    try {\r\n\r\n                        const res = await fetch(this.apiBaseUrl + \"api\/auth\/registerMember\", {\r\n                            method: \"POST\",\r\n                            headers: {\r\n                                \"Accept\": 'application\/json',\r\n                                \"Content-Type\": 'application\/json'\r\n                            },\r\n                            body: JSON.stringify(this.tagUser),\r\n                        });\r\n                        if (res.status == 401) {\r\n\r\n                        }\r\n                        if (res.status == 200) {\r\n\r\n                            const data = await res.json();\r\n                            localStorage.setItem('auth_token', data.access_Token);\r\n                            this.isAuth = true;\r\n                            return true;\r\n                        } else {\r\n                            return false;\r\n                        }\r\n\r\n                        console.log(\"Member created\")\r\n\r\n                    } catch (e) {\r\n\r\n                        return false;\r\n\r\n                    }\r\n\r\n                },\r\n                authenticate: async function() {\r\n\r\n\r\n                    try {\r\n\r\n                        console.log(\"Authn\");\r\n\r\n                        const un = this.flowData;\r\n                        let username = this.tagUser.Email;\r\n                        let password = this.tagUser.Password;\r\n                        var myHeaders = new Headers();\r\n                        myHeaders.append(\"Content-Type\", \"application\/json\");\r\n\r\n                        var raw = JSON.stringify({\r\n                            \"email\": username,\r\n                            \"password\": password\r\n                        });\r\n\r\n                        var requestOptions = {\r\n                            method: 'POST',\r\n                            headers: myHeaders,\r\n                            body: raw,\r\n                            redirect: 'follow'\r\n                        };\r\n\r\n                        let resp = await fetch(this.apiBaseUrl + \"api\/auth\/GetToken\", requestOptions)\r\n\r\n                        const data = await resp.json();\r\n\r\n                        console.log(\"authData \" + data);\r\n                        localStorage.setItem('auth_token', data.access_Token);\r\n                        document.cookie = \"name=auth_token; value=\" + data.access_Token + \";HttpOnly\";\r\n                        this.isAuth = true;\r\n                        return true;\r\n\r\n                    } catch (e) {\r\n\r\n                        return false;\r\n\r\n                    }\r\n\r\n\r\n                },\r\n                sendRegstrationData: async function(regData) {\r\n                    const token = localStorage.getItem(\"auth_token\");\r\n                    const res = await fetch(this.apiBaseUrl + \"api\/tagit\/register\", {\r\n                        method: \"POST\",\r\n                        headers: {\r\n                            Authorization: \"Bearer \" + token,\r\n                            \"Accept\": 'application\/json',\r\n                            \"Content-Type\": 'application\/json'\r\n                        },\r\n                        body: JSON.stringify(regData),\r\n                    });\r\n                    if (res.status == 401) {\r\n\r\n                    } else if (res.status == 200) {\r\n                        $('#exampleModal').modal(\"hide\");\r\n                    } else {\r\n\r\n                    }\r\n\r\n                    console.log(\"Data sent\")\r\n\r\n                },\r\n                initWizard: function() {\r\n\r\n\r\n                    var current_fs, next_fs, previous_fs; \/\/fieldsets\r\n                    var opacity;\r\n                    var current = 1;\r\n                    var steps = $(\"fieldset\").length;\r\n\r\n                    var data = this.flowData;\r\n                    var that = this;\r\n                    setProgressBar(current);\r\n\r\n                    $(\".next\").click(async function() {\r\n\r\n                        let curentform = this.dataset.parentform;\r\n                        let requiredelements = $('#' + curentform + ' input,textarea,select,checkbox,radio').filter('[required]:visible');\r\n                        let formIsInvalid = false;\r\n                        for (let i = 0; i < requiredelements.length; i++) {\r\n                            let curel = requiredelements[i];\r\n                            if (curel.value === \"\") {\r\n\r\n                                $(curel).css({\r\n                                    \"border-color\": \"red\",\r\n                                    \"border-width\": \"1px\",\r\n                                    \"border-style\": \"solid\"\r\n                                });\r\n                                formIsInvalid = true;\r\n                            }\r\n                        }\r\n\r\n                        if (formIsInvalid) {\r\n                            return;\r\n                        }\r\n\r\n                        if (!that.isAuth && current == 1 && that.modeIsLogin) {\r\n\r\n                            console.log(\"login mode\")\r\n                            var authResult = await that.authenticate();\r\n                            let dfdf = \"\";\r\n                            if (authResult == true) {\r\n\r\n                                current_fs = $(this).parent();\r\n                                next_fs = $(this).parent().next();\r\n                                \/\/Add Class Active\r\n                                $(\"#progressbar li\").eq($(\"fieldset\").index(next_fs)).addClass(\"active\");\r\n\r\n                                \/\/show the next fieldset\r\n                                next_fs.show();\r\n                                \/\/hide the current fieldset with style\r\n                                current_fs.animate({\r\n                                    opacity: 0\r\n                                }, {\r\n                                    step: function(now) {\r\n                                        \/\/ for making fielset appear animation\r\n                                        opacity = 1 - now;\r\n\r\n                                        current_fs.css({\r\n                                            'display': 'none',\r\n                                            'position': 'relative'\r\n                                        });\r\n                                        next_fs.css({\r\n                                            'opacity': opacity\r\n                                        });\r\n                                    },\r\n                                    duration: 500\r\n                                });\r\n                                setProgressBar(++current);\r\n                            }\r\n\r\n\r\n                        } else if (!that.modeIsLogin && current == 1) {\r\n\r\n                            \/\/Add Class Active\r\n                            let regResult = await that.registerMember();\r\n                            if (regResult) {\r\n                                \/\/that.authenticate();\r\n\r\n                                current_fs = $(this).parent();\r\n                                next_fs = $(this).parent().next();\r\n                                $(\"#progressbar li\").eq($(\"fieldset\").index(next_fs)).addClass(\"active\");\r\n\r\n                                \/\/show the next fieldset\r\n                                next_fs.show();\r\n                                \/\/hide the current fieldset with style\r\n                                current_fs.animate({\r\n                                    opacity: 0\r\n                                }, {\r\n                                    step: function(now) {\r\n                                        \/\/ for making fielset appear animation\r\n                                        opacity = 1 - now;\r\n\r\n                                        current_fs.css({\r\n                                            'display': 'none',\r\n                                            'position': 'relative'\r\n                                        });\r\n                                        next_fs.css({\r\n                                            'opacity': opacity\r\n                                        });\r\n                                    },\r\n                                    duration: 500\r\n                                });\r\n                                setProgressBar(++current);\r\n                            } else {\r\n\r\n                                console.log(\"register member failed\")\r\n\r\n                            }\r\n\r\n                        } else {\r\n\r\n                            current_fs = $(this).parent();\r\n                            next_fs = $(this).parent().next();\r\n                            \/\/Add Class Active\r\n                            $(\"#progressbar li\").eq($(\"fieldset\").index(next_fs)).addClass(\"active\");\r\n\r\n                            \/\/show the next fieldset\r\n                            next_fs.show();\r\n                            \/\/hide the current fieldset with style\r\n                            current_fs.animate({\r\n                                opacity: 0\r\n                            }, {\r\n                                step: function(now) {\r\n                                    \/\/ for making fielset appear animation\r\n                                    opacity = 1 - now;\r\n\r\n                                    current_fs.css({\r\n                                        'display': 'none',\r\n                                        'position': 'relative'\r\n                                    });\r\n                                    next_fs.css({\r\n                                        'opacity': opacity\r\n                                    });\r\n                                },\r\n                                duration: 500\r\n                            });\r\n                            setProgressBar(++current);\r\n\r\n                        }\r\n\r\n\r\n\r\n                    });\r\n\r\n                    $(\".previous\").click(function() {\r\n\r\n                        current_fs = $(this).parent();\r\n                        previous_fs = $(this).parent().prev();\r\n\r\n                        \/\/Remove class active\r\n                        $(\"#progressbar li\").eq($(\"fieldset\").index(current_fs)).removeClass(\"active\");\r\n\r\n                        \/\/show the previous fieldset\r\n                        previous_fs.show();\r\n\r\n                        \/\/hide the current fieldset with style\r\n                        current_fs.animate({\r\n                            opacity: 0\r\n                        }, {\r\n                            step: function(now) {\r\n                                \/\/ for making fielset appear animation\r\n                                opacity = 1 - now;\r\n\r\n                                current_fs.css({\r\n                                    'display': 'none',\r\n                                    'position': 'relative'\r\n                                });\r\n                                previous_fs.css({\r\n                                    'opacity': opacity\r\n                                });\r\n                            },\r\n                            duration: 500\r\n                        });\r\n                        setProgressBar(--current);\r\n                    });\r\n\r\n                    function setProgressBar(curStep) {\r\n                        var percent = parseFloat(100 \/ steps) * curStep;\r\n                        percent = percent.toFixed();\r\n                        $(\".progress-bar\")\r\n                            .css(\"width\", percent + \"%\")\r\n                    }\r\n\r\n                    $(\"#uifinish\").click(async function() {\r\n\r\n                        let curentform = this.dataset.parentform;\r\n                        let requiredelements = $('#' + curentform + ' input,textarea,select,checkbox,radio').filter('[required]:visible');\r\n                        let formIsInvalid = false;\r\n                        for (let i = 0; i < requiredelements.length; i++) {\r\n                            let curel = requiredelements[i];\r\n                            if (curel.value === \"\") {\r\n\r\n                                $(curel).css({\r\n                                    \"border-color\": \"red\",\r\n                                    \"border-width\": \"1px\",\r\n                                    \"border-style\": \"solid\"\r\n                                });\r\n                                formIsInvalid = true;\r\n                            }\r\n                        }\r\n\r\n                        if (formIsInvalid) {\r\n                            return;\r\n                        }\r\n\r\n\r\n                        console.log(\"this.flowData \" + JSON.stringify(data));\r\n                        let finalData = JSON.parse(JSON.stringify(data));\r\n                        let fielddata = [];\r\n\r\n                        for (let index = 0; index < finalData.length; index++) {\r\n                            const step = finalData[index];\r\n                            for (let i = 0; i < step.fields.length; i++) {\r\n                                const f = step.fields[i];\r\n                                if (f.fieldType !== \"label\") {\r\n                                    fielddata.push({\r\n                                        fieldId: f.id,\r\n                                        fieldName: f.fieldName,\r\n                                        fieldValue: f.fieldValue\r\n                                    });\r\n                                }\r\n                            }\r\n                        }\r\n\r\n                        let finalRegObject = {\r\n                            \"dynamicProperties\": fielddata,\r\n                            \"tagId\": that.tagId\r\n                        }\r\n\r\n                        that.sendRegstrationData(finalRegObject);\r\n\r\n                        return false;\r\n\r\n                    })\r\n\r\n                }\r\n            },\r\n\r\n        })\r\n    <\/script>\r\n\r\n     \r\n\t\t\t<div class=\"elementor-shortcode\"><\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\r\n\t\t\t\t<\/section>\r\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"footnotes":""},"class_list":["post-10614","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v24.9 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>tag-form | Tag-it<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/tag-it.nu\/en\/tag-form\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"tag-form | Tag-it\" \/>\n<meta property=\"og:url\" content=\"https:\/\/tag-it.nu\/en\/tag-form\/\" \/>\n<meta property=\"og:site_name\" content=\"Tag-it\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/tagitnu\" \/>\n<meta property=\"article:modified_time\" content=\"2022-04-28T18:59:17+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minute\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/tag-it.nu\/tag-form\/\",\"url\":\"https:\/\/tag-it.nu\/tag-form\/\",\"name\":\"tag-form | Tag-it\",\"isPartOf\":{\"@id\":\"https:\/\/tag-it.nu\/#website\"},\"datePublished\":\"2022-04-28T18:50:14+00:00\",\"dateModified\":\"2022-04-28T18:59:17+00:00\",\"breadcrumb\":{\"@id\":\"https:\/\/tag-it.nu\/tag-form\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/tag-it.nu\/tag-form\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/tag-it.nu\/tag-form\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"FORSIDE\",\"item\":\"https:\/\/tag-it.nu\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"tag-form\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/tag-it.nu\/#website\",\"url\":\"https:\/\/tag-it.nu\/\",\"name\":\"Tag-it\",\"description\":\"Online platform og QR m\u00e6rker til registrerings af ejendele, materiel og lokaliteter\",\"publisher\":{\"@id\":\"https:\/\/tag-it.nu\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/tag-it.nu\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/tag-it.nu\/#organization\",\"name\":\"Tag-it ApS\",\"url\":\"https:\/\/tag-it.nu\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/tag-it.nu\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/tag-it.nu\/wp-content\/uploads\/2021\/01\/NEW-QR-Tag-it-Logo-vertical-2.png\",\"contentUrl\":\"https:\/\/tag-it.nu\/wp-content\/uploads\/2021\/01\/NEW-QR-Tag-it-Logo-vertical-2.png\",\"width\":420,\"height\":190,\"caption\":\"Tag-it ApS\"},\"image\":{\"@id\":\"https:\/\/tag-it.nu\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/tagitnu\",\"https:\/\/www.instagram.com\/tag_it_nu\/\",\"https:\/\/www.linkedin.com\/company\/tag-it-nu\/\",\"https:\/\/www.youtube.com\/TagitNuDenmark\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"tag-form | Tag-it","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/tag-it.nu\/en\/tag-form\/","og_locale":"en_US","og_type":"article","og_title":"tag-form | Tag-it","og_url":"https:\/\/tag-it.nu\/en\/tag-form\/","og_site_name":"Tag-it","article_publisher":"https:\/\/www.facebook.com\/tagitnu","article_modified_time":"2022-04-28T18:59:17+00:00","twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"1 minute"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/tag-it.nu\/tag-form\/","url":"https:\/\/tag-it.nu\/tag-form\/","name":"tag-form | Tag-it","isPartOf":{"@id":"https:\/\/tag-it.nu\/#website"},"datePublished":"2022-04-28T18:50:14+00:00","dateModified":"2022-04-28T18:59:17+00:00","breadcrumb":{"@id":"https:\/\/tag-it.nu\/tag-form\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/tag-it.nu\/tag-form\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/tag-it.nu\/tag-form\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"FORSIDE","item":"https:\/\/tag-it.nu\/"},{"@type":"ListItem","position":2,"name":"tag-form"}]},{"@type":"WebSite","@id":"https:\/\/tag-it.nu\/#website","url":"https:\/\/tag-it.nu\/","name":"Tag-it","description":"Online platform og QR m\u00e6rker til registrerings af ejendele, materiel og lokaliteter","publisher":{"@id":"https:\/\/tag-it.nu\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/tag-it.nu\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/tag-it.nu\/#organization","name":"Tag-it ApS","url":"https:\/\/tag-it.nu\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/tag-it.nu\/#\/schema\/logo\/image\/","url":"https:\/\/tag-it.nu\/wp-content\/uploads\/2021\/01\/NEW-QR-Tag-it-Logo-vertical-2.png","contentUrl":"https:\/\/tag-it.nu\/wp-content\/uploads\/2021\/01\/NEW-QR-Tag-it-Logo-vertical-2.png","width":420,"height":190,"caption":"Tag-it ApS"},"image":{"@id":"https:\/\/tag-it.nu\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/tagitnu","https:\/\/www.instagram.com\/tag_it_nu\/","https:\/\/www.linkedin.com\/company\/tag-it-nu\/","https:\/\/www.youtube.com\/TagitNuDenmark"]}]}},"_links":{"self":[{"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/pages\/10614","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/comments?post=10614"}],"version-history":[{"count":4,"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/pages\/10614\/revisions"}],"predecessor-version":[{"id":10618,"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/pages\/10614\/revisions\/10618"}],"wp:attachment":[{"href":"https:\/\/tag-it.nu\/en\/wp-json\/wp\/v2\/media?parent=10614"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}