<div class="col-sm-8">
    <div class="row gray">
        <div class="col-sm-12 ">
            <div class="col-sm-12">
                <h3>Create Group </h3>  
                <hr>
            </div>

            <div class="col-sm-12"><br></div>
            <!--<div class="col-md-12" style="border: 1px solid green"></div>-->
            <div class="col-sm-12"><br></div>
            <div class="col-sm-12">

                <div class="col-sm-12  ">
                    <?php echo validation_errors(); //id="formID2" ?>
                    <form id="formID2" action="<?php echo base_url() . 'group/' . $group_details->url . '/edit-group'; ?>" method="post" name="create_group" enctype="multipart/form-data">
                        <div class="form-group col-sm-12">
                            <div class="input-group">
                                <input type="text" 
                                       data-errormessage-value-missing="Group Name is required!" 
                                       class="form-control validate[required, custom[special_char]]"   
                                       name="group_name" id="group_name"
                                       value="<?php
                                       if (set_value('group_name')) {
                                           echo set_value('group_name');
                                       } else {
                                           echo $group_details->group_name;
                                       }
                                       ?>" 
                                       placeholder="Please Type Group Name.." >
                                <span class="input-group-addon"  title="Please Type Group Name"><i class="fa fa-group"></i></span>
                            </div>
                            <br>
                        </div>

                        <div class="form-group col-sm-6">
                            <select name="group_type" id="group_type"
                                    data-errormessage-value-missing="Group type is required!"
                                    class="form-control validate[required]" 
                                    onchange="otherCategory(this.value)">
                                <option value="">Select Type</option>
                                <?php foreach ($group_type as $v_type) { ?>
                                    <option value="<?php echo $v_type->group_type_id; ?>"><?php echo $v_type->group_type_name; ?></option>
                                <?php } ?>
                                <option value="other">Other</option>
                            </select>

                            <script>
                                document.forms['create_group'].elements['group_type'].value = '<?php
                                if (set_value('group_type')) {
                                    echo set_value('group_type');
                                } else {
                                    echo $group_details->group_type_id;
                                }
                                ?>';
                            </script>
                        </div>

                        <div class="form-group col-sm-6" id="other_group_type" style="display: none">
                            <div class="input-group">
                                <input type="text" class="form-control" 
                                       data-errormessage-value-missing='Group type is required!' 
                                       class='form-control validate[required]'
                                       name='group_other_type' 
                                       id='group_other_type' 
                                       value='<?php
                                       if (set_value('group_other_type')) {
                                           echo set_value('group_other_type');
                                       }
                                       ?>' 
                                       placeholder='Please Type New Group type'
                                       onblur='checkGroupType(this.value);' >
                                <span class="input-group-addon" title="Please Type New Group type" ><i class="fa fa-retweet"></i></span>
                            </div>
                        </div>

                        <div class="col-sm-12"><br> <br></div>

                        <script>
                            function otherCategory(givenText) {

                                if (givenText == 'other') {
                                    var Othercategory = document.getElementById('other_group_type');
                                    Othercategory.setAttribute("style", 'display:block; ');
                                } else {
                                    var Othercategory = document.getElementById('other_group_type');
                                    Othercategory.setAttribute("style", 'display:none; ');
                                }
                            }
                        </script>

                        <div class="form-group col-sm-6">
                            <div class="input-group">
                                <input type="text" 
                                       data-errormessage-value-missing="Invitation code is required!"
                                       class="form-control validate[required, custom[groupinvitation],custom[spaceFunction],custom[codeExistence]] text-input" 
                                       name="group_public_id" 
                                       id="group_public_id" 
                                       value="<?php
                                       if (set_value('group_public_id')) {
                                           echo set_value('group_public_id');
                                       } else {
                                           echo $group_details->group_public_id;
                                       }
                                       ?>"
                                       placeholder="Please Type  Invitation Code.."   
                                       onblur="makerequest(this.value);">
                                <input type="hidden" id="incode" name='incode' value="" />
                                <span class="input-group-addon"  title="Please Type  Invitation Code"><i class="fa fa-newspaper-o"></i></span>
                            </div>
                        </div>

                        <div class="form-group col-sm-6">
                            <div class="input-group">

                                <input type="text"
                                       data-errormessage-value-missing="Group url is required!"
                                       class="form-control validate[required, custom[groupurl], custom[spaceFunction], custom[url_group_Existence]] text-input"
                                       name="group_url" id="group_url"
                                       value="<?php
                                       if (set_value('group_url')) {
                                           echo set_value('group_url');
                                       } else {
                                           echo $group_details->url;
                                       }
                                       ?>"
                                       placeholder="Please Type Group URL.." 
                                       onkeyup="checkurl(this.value);" onblur="checkurl(this.value);">
                                <input type="hidden" id="urlcode" name='urlcode' value=''/>
                                <input type="hidden" class="span6 typeahead" id="typeahead"  name="url_id" value="<?php echo $group_details->url_id ?>" >
                                <span class="input-group-addon"  title="Please Type Group URL"><i class="fa fa-link"></i></span>
                            </div>
                        </div>


                        <div class="col-sm-12"><br> <br></div>

                        <div class="form-group col-sm-12" >
                            <div class="input-group screen1280" id="" >
                                <center>  
                                    <textarea   name="group_description" id="group_description" class="form-control  resoulation1280 " rows="4"   ><?php
                                        if (set_value('group_description')) {
                                            echo set_value('group_description');
                                        } else {
                                            echo $group_details->group_description;
                                        }
                                        ?></textarea>
                                </center>
                            </div>

                        </div>


                        <div class="col-sm-12"><br> <br></div>
                        <div class="form-group col-sm-6">
                            <select data-errormessage-value-missing="Permission is required!"
                                    class="form-control validate[required] text-input"
                                    id="group_permission"  name="group_permission" >
                                <option value=""> -Select User Permission - </option>
                                <option value="1">Public</option>
                                <option value="2">All Talha Training User</option>
                                <option value="3">My link</option>
                                <option value="4">Only group Member</option>

                            </select>
                            <script>
                                document.forms['create_group'].elements['group_permission'].value = '<?php
                                        if (set_value('group_permission')) {
                                            echo set_value('group_permission');
                                        } else {
                                            echo $group_details->group_permission;
                                        }
                                        ?>';
                            </script>
                        </div>

                        <div class="col-sm-12"><br> <br></div>

                        <div class="form-group col-sm-12">
                            <div class="input-group">
                                <label class="col-sm-4" for="group_status">Group Status:</label>
                                <div class="radio radio-success col-sm-8 radio-margin" >
                                    <input type="radio" 
                                           data-errormessage-value-missing="Group Status is Required!" 
                                           class="validate[required]"  
                                           name="group_status" id="published" value="1" >
                                    <label for="published">Published</label>
                                    <span style="margin-right: 30px"></span>
                                    <input type="radio"
                                           data-errormessage-value-missing="Group Status is Required!" 
                                           class="validate[required]"
                                           name="group_status" id="unpublished" value="0">
                                    <label for="unpublishded">Unpublished</label>
                                </div>
                            </div>
                            <script>
                                document.forms['create_group'].elements['group_status'].value = '<?php
                                        if (set_value('group_status')) {
                                            echo set_value('group_status');
                                        } else {
                                            echo $group_details->group_status;
                                        }
                                        ?>';
                            </script>
                        </div>

                        <div class="col-sm-12"><br><br></div>

                        <div class="form-group col-sm-6 col-sm-offset-3">
                            <input type="submit" class="green-btn btn btn-default" value="Update Group"><br/><br/>
                        </div>
                        <div class="col-sm-3"></div>
                    </form>
                </div>

            </div>

        </div><!-- /.row gray -->

    </div>
</div>

<script type="text/javascript">
<!--
//Create a boolean variable to check for a valid Internet Explorer instance.
    var xmlhttp = false;
//Check if we are using IE.
    try {
//If the Javascript version is greater than 5.
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
//alert(xmlhttp);
//alert ("You are using Microsoft Internet Explorer.");
    } catch (e) {
        //alert(e);

//If not, then use the older active x object.
        try {
//If we are using Internet Explorer.
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
//alert ("You are using Microsoft Internet Explorer");
        } catch (E) {
            // alert(E);
//Else we must be using a non-IE browser.
            xmlhttp = false;
        }
    }
//If we are using a non-IE browser, create a javascript instance of the object.
    if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
        xmlhttp = new XMLHttpRequest();
//alert ("You are not using Microsoft Internet Explorer");
    }

    function makerequest(given_text)
    {
        alert(given_text);
        //var obj = document.getElementById(objID);
        if (given_text == '') {
            document.getElementById(objID).innerHTML = '';
            document.getElementById("incode").setAttribute("value", 1);
        }

        var patt = new RegExp(" ");
        var res = patt.test(given_text);

        if (res) {

        } else {
            if (given_text) {
                serverPage = '<?php echo base_url(); ?>group_con/check_public_group_code_for_edit/' + given_text;
                xmlhttp.open("GET", serverPage);
                xmlhttp.onreadystatechange = function ()
                {
//                    alert(xmlhttp.readyState);
//                    alert(xmlhttp.status);
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                    {
                        if (xmlhttp.responseText == 1)
                        {
                            alert(xmlhttp.responseText);
                            document.getElementById("incode").setAttribute("value", 0);
                        }
                        if (xmlhttp.responseText == 2)
                        {
                            document.getElementById("incode").setAttribute("value", 1);
                        }
                    }
                }
            }
        }
        xmlhttp.send(null);
    }


    function checkurl(given_text)
    {
        //alert(given_text);
        //var obj = document.getElementById(objID);

        if (given_text == '') {
            document.getElementById("urlcode").setAttribute("value", 1);
        }

        var patt = new RegExp(" ");
        var res = patt.test(given_text);

        if (res) {

        } else {

            if (given_text) {
                serverPage = '<?php echo base_url(); ?>group_con/check_group_url_for_edit/' + given_text;
                xmlhttp.open("GET", serverPage);
                xmlhttp.onreadystatechange = function ()
                {
                    //alert(xmlhttp.readyState);
                    //alert(xmlhttp.status);
                    if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
                    {
//                        alert(xmlhttp.responseText);
                        //document.getElementById(objID).innerHTML = xmlhttp.responseText;
                        //document.getElementById(objcw).innerHTML = xmlhttp.responseText;
                        if (xmlhttp.responseText == 1)
                        {
                            document.getElementById("urlcode").setAttribute("value", 0);
                        }
                        if (xmlhttp.responseText == 2)
                        {
                            document.getElementById("urlcode").setAttribute("value", 1);
                        }
                    }
                }
            }
        }
        xmlhttp.send(null);
    }

    $(document).ready(function () {

        $("#group_public_id").on("keypress keyup keydown blur", function () {

            var pass = $(this).val();
            makerequest(pass, 'res');
        });
    });


    $(document).ready(function () {

        $("#group_url").on("keypress keyup keydown blur", function () {

            var pass = $(this).val();
            checkurl(pass, 'res2');
        });
    });
//-->
</script>