<form action="page.asp" method="post" class="form-horizontal" id="form2"></form>
<div class="modal-content animated fadeIn">
<form action="forms_SPedit.asp" method="post" class="form-horizontal" id="form1"></form>
Then on line 76 you have an orphan </form> which indicates that you probably made a typo with one of the form declarations above. Not sure why you have two - probably an error but I am going to guess that the second one should not be closed and that the closing </form> on line 76 is where the actual close should occur.<div class="modal-body edit-content">
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
esseyId = e.relatedTarget.id;
$('input[name="idvalue"]', $modal).val(esseyId); // HERE
$modal.find('.edit-content').html(esseyId);
})
<script>
$(function () {
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
esseyId = e.relatedTarget.id;
$('input[name="idfield"]', $modal).val(esseyId); // HERE
$modal.find('.edit-content').html(esseyId);
});
});</script>
Please look at the source code of the sample I provided - the code there works.
<%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%>
<!DOCTYPE html>
<head>
<!--#include file="../../includes/bdot/headlevel2.asp"-->
<!--#include file="../../includes/bdot/scripts.asp"-->
<link href="../includes/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<script src="../includes/jquery/jquery-2.1.4.min.js"></script>
</head>
<!--#Body-->
<body>
<div id="wrapper">
<nav class="navbar-default navbar-static-side" role="navigation">
<div class="sidebar-collapse">
<!--#Left menu-->
<!--#include file="../../includes/bdot/leftnavfilescases.asp"-->
</div>
</nav>
<div id="page-wrapper" class="gray-bg">
<div class="row border-bottom">
<!-- Top bar -->
<!--#include file="../../includes/bdot/navbarlevel2.asp"-->
</div>
<!-- Breadcrumbs navigation -->
<div class="row wrapper border-bottom white-bg page-heading">
<div class="col-lg-10">
<h2>Cases</h2>
<ol class="breadcrumb">
<li><a href="../default.asp">Home</a></li>
<li >Files</li>
<li class="active"><strong><a href="SearchViewsearchcases.asp">Cases</a></strong></li>
<li class="active"><strong><a href="../Contacts/personal_general.asp?NewUserId=<%=(rs_case.Fields.Item("alienid").Value)%>" target="_blank"><%=(rs_case.Fields.Item("FirstNm").Value)%> <%=(rs_case.Fields.Item("MiddleNm").Value)%> <%=(rs_case.Fields.Item("LastNm").Value)%></a></strong></li>
<li ><%=(rs_case.Fields.Item("Processcatalog").Value)%></li>
<li class="active"><%=(rs_case.Fields.Item("caseid").Value)%></li>
</ol>
</div>
</div>
<!-- Breadcrumbs navigation end -->
<!-- Navigation bar -->
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">General Information <span class="caret"></span></a>
<ul class="dropdown-menu">
<li ><a href="general_basic_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Basic information</a></li>
<li role="separator" class="divider"></li>
<li><a href="general_notices_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Notices</a></li>
<li role="separator" class="divider"></li>
<li><a href="general_shipping_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Shipping</a></li>
<li role="separator" class="divider"></li>
<li><a href="general_billing_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Billing</a></li>
</ul>
</li>
<li><a href="links_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Links</a></li>
<li class="active"><a href="forms_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Forms</a></li>
<li><a href="notes_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Notes</a></li>
<li><a href="reminders_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Reminders</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documents<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="checklist_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Checklist</a></li>
<li role="separator" class="divider"></li>
<li><a href="ltrmerge_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Letter Merge</a></li>
<li role="separator" class="divider"></li>
<li><a href="attachments_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Attachments</a></li>
</ul>
</li>
<li><a href="steps_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Steps</a></li>
<li><a href="log_index.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>">Log</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>
<!-- Navigation bar end-->
<!-- Main content left-->
<form name="form1" action="" method="POST" class="form-horizontal" id="form1">
<div class="wrapper wrapper-content animated fadeIn" style="animation-delay: 0.4s;">
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Forms</h5>
<div class="ibox-tools"> <a class="collapse-link"> <i class="fa fa-chevron-up"></i> </a> <a class="close-link"> <i class="fa fa-times"></i> </a> </div>
</div>
<div class="ibox-content">
<a href="forms_add.asp?caseid=<%=(rs_case.Fields.Item("id").Value)%>" class="btn btn-primary">Add form</a>
</div>
<div class="ibox-content">
<table class="table table-hover">
<thead>
<tr>
<th>Actions</th>
<th>Beneficiary</th>
<th>Form</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<%
While ((Repeat1__numRows <> 0) AND (NOT rs_forms.EOF))
%>
<tr>
<td><a href="javascript:;" onClick="MM_openBrWindow('forms_bridgecall.asp?caseid=<%=(rs_case.Fields.Item("Id").Value)%>&userid=<%=(rs_forms.Fields.Item("mainuserid").Value)%>&Activityid=<%=(rs_forms.Fields.Item("id").Value)%>&qid=<%=(rs_forms.Fields.Item("qid").Value)%>&Blobid=<%=(rs_forms.Fields.Item("Blobid").Value)%>','BlueForm','scrollbars=yes,resizable=yes,width=1000,height=800')"><i class=" btn btn-white btn-sm fa fa-eye"></i></a> <a href="#myModalformcaseid=<%=(rs_forms.Fields.Item("id").Value)%>" data-toggle="modal" id="<%=(rs_forms.Fields.Item("id").Value)%>" data-target="#edit-modal"><i class="btn btn-white btn-sm fa fa-folder"></i></a> <a href="forms_SPdelete.asp?formcaseid=<%=(rs_forms.Fields.Item("id").Value)%>&caseid=<%=(rs_case.Fields.Item("Id").Value)%>&blobid=<%=(rs_forms.Fields.Item("Blobid").Value)%>" class="btn btn-white btn-sm1" id="<%=(rs_forms.Fields.Item("id").Value)%>" > <i class="fa fa-trash-o" ></i></a> <div>
</td>
<td><%=(rs_forms.Fields.Item("FirstNm").Value)%> <%=(rs_forms.Fields.Item("LastNm").Value)%></td>
<td><%=(rs_forms.Fields.Item("fname").Value)%></td>
<td><%=(rs_forms.Fields.Item("fdescription").Value)%></td>
</tr>
<%
Repeat1__index=Repeat1__index+1
Repeat1__numRows=Repeat1__numRows-1
rs_forms.MoveNext()
Wend
%>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</form>
<!-- footer -->
<!--#include file="../../includes/bdot/footer2.asp"-->
</div>
<!-- sidebar -->
<div id="right-sidebar">
<div class="sidebar-container">
<!--#include file="../../includes/bdot/sidebar.asp"-->
</div>
</div>
<div id="edit-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content animated fadeIn">
<form action="forms_SPedit.asp" method="post" class="form-horizontal" id="form2" form="form2">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 class="modal-title">Edit form</h3><small>Please select the Beneficiary that will fill out the form and update the description.</small>
</div>
<div class="panel-body">
<div >
<div class="ibox float-e-margins">
<div class="form-group"><label class="col-sm-2 control-label">Beneficiary</label>
<div class="col-sm-10">
<select class="form-control m-b" name="account">
<option>option 1</option>
<option>option 2</option>
<option>option 3</option>
<option>option 4</option>
</select>
</div> </div>
<div class="form-group"><label class="col-sm-2 control-label">Description</label>
<div class="col-sm-10"><input id = "idfield" name "idfield" type="text" class="form-control" placeholder="Mr. | Ms." value="<%=request("formcaseid")%>"></div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" id = "mdlsave" name = "mdlsave" >Save changes</button>
</div>
</div>
</form>
</div>
</div>
</body>
</html>
<!-- Bootstrap scripts -->
<!--#include file="../../includes/bdot/bdotbootstrapscriptslevel2.asp"-->
<script src="../includes/formvalidation/dist/js/formValidation.min.js"></script>
<script src="../includes/formvalidation/dist/js/framework/bootstrap.min.js"></script>
<script src="../includes/js/plugins/sweetalert/sweetalert.min.js"></script>
<script>
$('a.btn-white.btn-sm1').click(function(e) {
e.preventDefault(); // Prevent the href from redirecting directly
var linkURL = $(this).attr("href");
warnBeforeRedirect(linkURL);
});
function warnBeforeRedirect(linkURL) {
swal({
title: "Are you sure?",
text: "Please confirm you wish to delete this record",
type: "warning",
confirmButtonColor: "#DD6B55",
showCancelButton: true,
}, function() {
// Redirect the user
window.location.href = linkURL;
});
}
</script>
<script>
$(function () {
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
esseyId = e.relatedTarget.id;
$('input[name="idfield"]', $modal).val(esseyId); // HERE
$modal.find('.edit-content').html(esseyId);
});
});</script>t>
<input id = "idfield" name "idfield" ... />
$('#edit-modal').on('show.bs.modal', function(e) {
...
});
What the repeated code is doing is each time overwriting the content of the modal - so the first one fires sets the id field and loads the modal window - then the next one fires and sets a different field and loads the modal etc.<a href="#myModal" data-toggle="modal" data-id="786" data-description="description" data-target="#edit-modal"><i class="btn btn-white btn-sm fa fa-folder">OPEN MODAL</i></a>
These can be accessed with the jQuery .data() method (see below). Before you can do this you will need to wrap your e.relatedTarget (which is a standard DOM element) in a jQuery object. You do this like so
$(e.releatedTarget)
You can now use this object to access the jQuery methods.<script type="text/javascript">
$(function () {
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
// WE RATHER USE THE HTML5 data ATTRIBUTE TO
// PASS DATA. id's IN HTML CANNOT START WITH NUMBERS
// SO NOT A GOOD IDEA TO USE THE id ATTRIBUTE.
// WE WRAP THE e.relatedTarget IN A JQUERY OBJET
// WHICH GIVES US ACCESS TO THE .data() METHOD.
// WE CAN NOW GET ANY CUSTOM HTML5 data ATTRIBUTE
esseyId = $(e.relatedTarget).data('id'),
description = $(e.relatedTarget).data('description');
// SET YOUR FORM VALUES HERE
$('input[name="idvalue"]', $modal).val(esseyId);
$('input[name="description"]', $modal).val(description);
// OTHER ASSIGNMENTS HERE
$modal.find('.edit-content').html(esseyId);
})
});
</script>
<a href="#myModal" data-toggle="modal" id="<%=(rs_forms.Fields.Item("id").Value)%>" mainuserid="<%=(rs_forms.Fields.Item("mainuserid").Value)%>" fdescription="<%=(rs_forms.Fields.Item("fdescription").Value)%>" data-target="#edit-modal"><i class="btn btn-white btn-sm fa fa-folder"></i></a>
No, you can't use the id field - as I mentioned before id cannot start with a number. You need to use the custom data attributes as per the link I sent earlier. <a href="#myModal" data-toggle="modal" data-id="<%=(rs_forms.Fields.Item("id").Value)%>" data-mainuserid="<%=(rs_forms.Fields.Item("mainuserid").Value)%>" data-fdescription="<%=(rs_forms.Fields.Item("fdescription").Value)%>" data-target="#edit-modal"><i class="btn btn-white btn-sm fa fa-folder"></i></a>
SCRIPT5009: 'data' is undefinedThat says something is wrong with your javascript - either your jQuery library is not being included - which would not make sense because other jQuery dependencies work.
error '80020009'
/bluedot2016/Intranet/Cases/forms_index.asp, line 72
I believe maybe the syntax in one of those 3 is incorrect and therefore the value is not being passed. Right now none of the values is being passed.That's because you have a script error somewhere in your code. The sample I provided works so there is nothing wrong with the logic - it is in the implementation. We can look at the bits that were part of the sample forever - it is not telling us where the problem is - we need to see the code in context of what else is on the page.
<!DOCTYPE html>
<!--#BlueDot Include files-->
<!--#BeginBlock-->
<!--#Recordsets include-->
<!--#Current user logged in-->
<!--#Total Admin alert-->
<!--#Total Alerts count-->
<!--#Reminders overdue count-->
<!--#Repeat steps overdue count-->
<!--#Questionnaire view-->
<!--#Questionnaire ALL count-->
<!--#Questionnaire mine count-->
<!--#Questionnaire Questionnairegroupusers-->
<!--#Repeated region-->
<head>
<!--#Bootstrap -->
<link href="../includes/css/bootstrap.min.css" rel="stylesheet">
<link href="../includes/font-awesome/css/font-awesome.css" rel="stylesheet">
<!-- Morris -->
<link href="../includes/css/plugins/morris/morris-0.4.3.min.css" rel="stylesheet">
<!-- Gritter -->
<link href="../includes/js/plugins/gritter/jquery.gritter.css" rel="stylesheet">
<link href="../includes/css/animate.css" rel="stylesheet">
<link href="../includes/css/style.css" rel="stylesheet">
<script type="text/JavaScript">
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
<script type="text/JavaScript">
function MM_openBrWindow(theURL,winName,features) { //v2.0
window.open(theURL,winName,features);
}
//-->
</script>
<script type="text/javascript">
function WAAddError(formElement,errorMsg,focusIt,stopIt) {
if (document.WAFV_Error) {
document.WAFV_Error += "\n" + errorMsg;
}
else {
document.WAFV_Error = errorMsg;
}
if (!document.WAFV_InvalidArray) {
document.WAFV_InvalidArray = new Array();
}
document.WAFV_InvalidArray[document.WAFV_InvalidArray.length] = formElement;
if (focusIt && !document.WAFV_Focus) {
document.WAFV_Focus = focusIt;
}
if (stopIt == 1) {
document.WAFV_Stop = true;
}
else if (stopIt == 2) {
formElement.WAFV_Continue = true;
}
else if (stopIt == 3) {
formElement.WAFV_Stop = true;
formElement.WAFV_Continue = false;
}
}
</script>
<script type="text/javascript">
function makeLowercase() {
document.form1.outstring.value = document.form1.instring.value.toLowerCase();
}
//-->
</script>
<link href="../includes/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<script src="../includes/jquery/jquery-2.1.4.min.js"></script>
</head>
<!--#Body-->
<!--#Body-->
<body>
<div id="wrapper">
<nav class="navbar-default navbar-static-side" role="navigation">
<div class="sidebar-collapse">
<!--#Left menu-->
<nav class="navbar-default navbar-static-side" role="navigation">
<div class="sidebar-collapse">
<ul class="nav metismenu" id="side-menu">
<li class="nav-header">
<div class="dropdown profile-element"><img src="../../imgs/BlueDot_logo_transp.png" class="img-responsive" alt="Placeholder image"></div>
<div class="logo-element">
BlueDot
</div>
</li>
<li >
<a href="../default.asp"><i class="fa fa-dashboard"></i> <span class="nav-label">Dashboard</span></a>
</li>
<li class="active">
<a href="#"><i class="fa fa-bar-chart-o"></i> <span class="nav-label">Files</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse">
<li>
<a href="#">Questionnaire<span class="fa arrow"></span></a>
<ul class="nav nav-third-level">
<li>
<a href="../qnr/IndexNewcontact.asp">New contact</a>
</li>
<li>
<a href="../qnr/EmailQnrexistingsearch.asp">Existing contact</a>
</li>
</ul>
</li>
<li ><a href="../contacts/searchviewsearchcontacts.asp">Contacts</a></li>
<li class="active"><a href="../cases/searchviewsearchcases.asp">Cases</a></li>
<li><a href="../employers/searchviewsearchemployers.asp">Employers</a></li>
<li><a href="../billing/index.asp">Billing</a></li>
<li><a href="../RegionalCenters/Index.asp">Regional Centers</a></li>
<li><a href="../Agents/Index.asp">Agents</a></li>
</ul>
</li>
<li>
<a href="#"><i class="fa fa-envelope"></i> <span class="nav-label">Messages</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse">
<li><a href="../inbox/index.asp">Inbox</a></li>
<li><a href="../inbox/outbox.asp">Outbox</a></li>
</ul>
</li>
<li>
<a href="#"><i class="fa fa-bar-chart-o"></i> <span class="nav-label">Reports</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse">
<li>
<a href="#">Basic<span class="fa arrow"></span></a>
<ul class="nav nav-third-level">
<li>
<a href="../reports/basic_contacts_index.asp">Contacts</a>
</li>
<li>
<a href="../reports/basic_cases_index.asp">Cases</a>
</li>
<li>
<a href="../reports/basic_employers_index.asp">Employers</a>
</li>
<li>
<a href="../reports/basic_billing_index.asp">Billing</a>
</li>
</ul>
</li>
<li><a href="../reports/Indexbyuser.asp">Advanced</a></li>
</ul>
</li>
<li>
<a href="#"><i class="fa fa-wrench"></i> <span class="nav-label">Tools</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse">
<li><a href="../Tools/blankforms.asp">Blank forms</a></li>
<li><a href="../Tools/relatedlinks.asp">Useful links</a></li>
<li><a href="../Calendar/index.asp">Calendar</a></li>
<li><a href="../RCContent/IndexRC.asp">Resource Center</a></li>
</ul>
</li>
<li>
<a href="#"><i class="fa fa-male"></i> <span class="nav-label">User Settings</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse">
<li ><a href="../Tools/index.asp">User preferences</a></li>
<li><a href="../updatepassword.asp">Change password</a></li>
</ul>
</li>
<li>
<a href="#"><i class="fa fa-support"></i> <span class="nav-label">Support</span><span class="fa arrow"></span></a>
<ul class="nav nav-second-level collapse">
<li><a href="javascript:;" onClick="GP_AdvOpenWindow('https://bluedotcloud.zendesk.com/hc/en-us','BlueDot','fullscreen=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,channelmode=no,directories=no',1280,768,'center','ignoreLink','alwaysOnTop',0,'',0,1,5,'');return document.MM_returnValue">Help center</a></li>
<li><a href="javascript:;" onClick="GP_AdvOpenWindow('https://www.bluedotcloud.com/BDotBT/index.html','BlueDot','fullscreen=no,toolbar=no,location=no,status=no,menubar=no,scrollbars=no,resizable=no,channelmode=no,directories=no',1280,768,'center','ignoreLink','alwaysOnTop',0,'',0,1,5,'');return document.MM_returnValue">Basic Training</a></li>
</ul>
</li>
</ul>
</div>
</nav>
</div>
</nav>
<div id="page-wrapper" class="gray-bg">
<div class="row border-bottom">
<!-- Top bar -->
<!--#Navigation bar-->
<nav class="navbar navbar-static-top white-bg" role="navigation" style="margin-bottom: 0">
<div class="navbar-header">
<a class="navbar-minimalize minimalize-styl-2 btn btn-primary " href="#"><i class="fa fa-bars"></i> </a>
</div>
<ul class="nav navbar-top-links navbar-right">
<li>
<span class="m-r-sm text-muted welcome-message">Welcome Ann Jones</span>
</li>
<!--#Modal window code-->
<div class="modal inmodal" id="myModal" tabindex="-1" role="dialog" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content animated bounceInRight">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
<i class="fa fa-laptop modal-icon"></i>
<h4 class="modal-title">BlueDot Major Upgrade</h4>
<small class="font-bold">Posted on: 6/29/2015</small>
</div>
<div class="modal-body">
<p>Dynamic content goes here: This is the message about BlueDot's major upgradeDynamic content goes here: This is the message about BlueDot's major upgradeDynamic content goes here: This is the message about BlueDot's major upgradeDynamic content goes here: This is the message about BlueDot's major upgradeDynamic content goes here: This is the message about BlueDot's major upgradeDynamic content goes here: This is the message about BlueDot's major upgradeDynamic content goes here: This is the message about BlueDot's major upgrade</p>
<div class="form-group"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<!--#Modal window code end-->
<!--#BlueDot announcement icon code-->
<li class="dropdown">
<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
<i class="fa fa-rss"></i>
<span class="label label-warning">
1
</span>
</a>
<ul class="dropdown-menu dropdown-alerts">
<li>
<a href="#">
<div>
<i class="fa fa-envelope" data-toggle="modal" data-target="#myModal" > BlueDot Major Upgrade</i>
</div>
</a>
</li>
</ul>
</li>
<!--#Inbox icon code-->
<li class="dropdown">
<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
<i class="fa fa-envelope"></i>
<span class="label label-warning">
2<br/>
</span>
</a>
<ul class="dropdown-menu dropdown-alerts">
<li>
<a href="../inbox/index.asp">
<div>
<i class="fa fa-envelope fa-fw"></i> You have
2<br/>
items in your inbox
</div>
</a>
</li>
</ul>
</li>
<!--#Alerts icon code-->
<li class="dropdown">
<a class="dropdown-toggle count-info" data-toggle="dropdown" href="#">
<i class="fa fa-bell"></i> <span class="label label-danger">108</span>
</a>
<ul class="dropdown-menu dropdown-alerts">
<li>
<a href="../remindersoverdue.asp">
<div>
<i class="fa fa-bell fa-fw"></i> You have 20 overdue reminders
</div>
</a>
</li>
<li class="divider"></li>
<li>
<a href="../stepsoverdue.asp">
<div>
<i class="fa fa-bell fa-fw"></i> You have 88 overdue process steps
</div>
</a>
</li>
</ul>
</li>
<li>
<a href="../../signout.asp">
<i class="fa fa-sign-out"></i> Log out
</a>
</li>
<li>
<a class="right-sidebar-toggle">
<i class="fa fa-tasks"></i>
</a>
</li>
</ul>
</nav>
</div>
<!-- Breadcrumbs navigation -->
<div class="row wrapper border-bottom white-bg page-heading">
<div class="col-lg-10">
<h2>Cases</h2>
<ol class="breadcrumb">
<li><a href="../default.asp">Home</a></li>
<li >Files</li>
<li class="active"><strong><a href="SearchViewsearchcases.asp">Cases</a></strong></li>
<li class="active"><strong><a href="../Contacts/personal_general.asp?NewUserId=30638" target="_blank">Alejandro Carlos Mucino</a></strong></li>
<li >H1B Visa Process</li>
<li class="active">DEMO for Forms</li>
</ol>
</div>
</div>
<!-- Breadcrumbs navigation end -->
<!-- Navigation bar -->
<nav class="navbar navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav">
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">General Information <span class="caret"></span></a>
<ul class="dropdown-menu">
<li ><a href="general_basic_index.asp?caseid=11106">Basic information</a></li>
<li role="separator" class="divider"></li>
<li><a href="general_notices_index.asp?caseid=11106">Notices</a></li>
<li role="separator" class="divider"></li>
<li><a href="general_shipping_index.asp?caseid=11106">Shipping</a></li>
<li role="separator" class="divider"></li>
<li><a href="general_billing_index.asp?caseid=11106">Billing</a></li>
</ul>
</li>
<li><a href="links_index.asp?caseid=11106">Links</a></li>
<li class="active"><a href="forms_index.asp?caseid=11106">Forms</a></li>
<li><a href="notes_index.asp?caseid=11106">Notes</a></li>
<li><a href="reminders_index.asp?caseid=11106">Reminders</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Documents<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="checklist_index.asp?caseid=11106">Checklist</a></li>
<li role="separator" class="divider"></li>
<li><a href="ltrmerge_index.asp?caseid=11106">Letter Merge</a></li>
<li role="separator" class="divider"></li>
<li><a href="attachments_index.asp?caseid=11106">Attachments</a></li>
</ul>
</li>
<li><a href="steps_index.asp?caseid=11106">Steps</a></li>
<li><a href="log_index.asp?caseid=11106">Log</a></li>
</ul>
</div><!--/.nav-collapse -->
</div><!--/.container-fluid -->
</nav>
<!-- Navigation bar end-->
<!-- Main content left-->
<form name="form1" action="" method="POST" class="form-horizontal" id="form1">
<div class="wrapper wrapper-content animated fadeIn" style="animation-delay: 0.4s;">
<div class="row">
<div class="col-lg-12">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Forms</h5>
<div class="ibox-tools"> <a class="collapse-link"> <i class="fa fa-chevron-up"></i> </a> <a class="close-link"> <i class="fa fa-times"></i> </a> </div>
</div>
<div class="ibox-content">
<a href="forms_add.asp?caseid=11106" class="btn btn-primary">Add form</a>
</div>
<div class="ibox-content">
<table class="table table-hover">
<thead>
<tr>
<th>Actions</th>
<th>Beneficiary</th>
<th>Form</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<a href="javascript:;" onClick="MM_openBrWindow('forms_bridgecall.asp?caseid=11106&userid=30638&Activityid=954&qid=41258&Blobid=','BlueForm','scrollbars=yes,resizable=yes,width=1000,height=800')"><i class=" btn btn-white btn-sm fa fa-eye"></i></a> <a href="#myModal" data-toggle="modal" data-id="954" data-mainuserid="30638" data-fdescription="CONTACT INFORMATION [3/26/2010]" data-target="#edit-modal"><i class="btn btn-white btn-sm fa fa-folder"></i></a> <a href="forms_SPdelete.asp?formcaseid=954&caseid=11106&blobid=" class="btn btn-white btn-sm1" id="954" > <i class="fa fa-trash-o" ></i></a>
</td>
<td>Alejandro Mucino</td>
<td>CONTACT</td>
<td>CONTACT INFORMATION [3/26/2010]</td>
</tr>
<tr>
<td>
<a href="javascript:;" onClick="MM_openBrWindow('forms_bridgecall.asp?caseid=11106&userid=30638&Activityid=955&qid=41257&Blobid=25','BlueForm','scrollbars=yes,resizable=yes,width=1000,height=800')"><i class=" btn btn-white btn-sm fa fa-eye"></i></a> <a href="#myModal" data-toggle="modal" data-id="955" data-mainuserid="30638" data-fdescription="EMPLOYER INFORMATION []" data-target="#edit-modal"><i class="btn btn-white btn-sm fa fa-folder"></i></a> <a href="forms_SPdelete.asp?formcaseid=955&caseid=11106&blobid=25" class="btn btn-white btn-sm1" id="955" > <i class="fa fa-trash-o" ></i></a>
</td>
<td>Alejandro Mucino</td>
<td>EMPLOYER</td>
<td>EMPLOYER INFORMATION []</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</form>
<!-- footer -->
<div class="footer">
<div class="pull-right"><a href="../../TermsofService.asp" target="new">Terms and Conditions</a> | <a href="../../PrivacyPolicy.asp" target="_blank">Privacy Policy</a></div>
<div><strong>Copyright</strong> BlueDot © 2015</div>
</div>
</div>
<!-- sidebar -->
<div id="right-sidebar">
<div class="sidebar-container">
<div class="tab-content">
<div id="tab-1" class="tab-pane active">
<div>
<div class="sidebar-message">
<div class="pull-left text-center"></div>
<div class="media-body">This panel will be used in the near future and will include shotcuts to your favorite actions.</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="edit-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content animated fadeIn">
<form action="forms_SPedit.asp" method="post" class="form-horizontal" id="form2" form="form2">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h3 class="modal-title">Edit form</h3><small>Please select the Beneficiary that will fill out the form and update the description.</small>
</div>
<div class="panel-body">
<div >
<div class="ibox float-e-margins">
<div class="form-group"><label class="col-sm-2 control-label">Beneficiary</label>
<div class="col-sm-10">
<select class="form-control m-b" id ="mainuserid" name="mainuserid">
<option value="30618">Jorge C. Mucino ( Son)</option>
<option value="30574">Ana Sofia R. Mucino ( Daughter)</option>
<option value="31053">Patricia MiddleNm Mucino ( Spouse)</option>
<option value="30710">Sergio Mucino ( Father)</option>
<option value="31227">Angelica Mucino ( Mother)</option>
<option value="30638">Alejandro Carlos Mucino ( Main Contact)</option>
</select>
<input type="hidden" id = "idfield" name ="idfield" >
<input name ="caseid" type="hidden" id = "caseid" value="11106" >
</div> </div>
<div class="form-group"><label class="col-sm-2 control-label">Description</label>
<div class="col-sm-10"><input id = "data-fdescription" name ="fdescription" type="text" class="form-control" placeholder="Mr. | Ms." value=""></div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-white" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary" id = "mdlsave" name = "mdlsave" >Save changes</button>
</div>
</form></div>
</div>
</div>
<!-- Bootstrap scripts -->
<!-- Mainly scripts -->
<script src="../includes/js/jquery-2.1.1.js"></script>
<script src="../includes/js/bootstrap.min.js"></script>
<script src="../includes/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="../includes/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<!-- Custom and plugin javascript -->
<script src="../includes/js/inspinia.js"></script>
<script src="../includes/js/plugins/pace/pace.min.js"></script>
<script src="../includes/formvalidation/dist/js/formValidation.min.js"></script>
<script src="../includes/formvalidation/dist/js/framework/bootstrap.min.js"></script>
<script src="../includes/js/plugins/sweetalert/sweetalert.min.js"></script>
<script>
$('a.btn-white.btn-sm1').click(function(e) {
e.preventDefault(); // Prevent the href from redirecting directly
var linkURL = $(this).attr("href");
warnBeforeRedirect(linkURL);
});
function warnBeforeRedirect(linkURL) {
swal({
title: "Are you sure?",
text: "Please confirm you wish to delete this record",
type: "warning",
confirmButtonColor: "#DD6B55",
showCancelButton: true,
}, function() {
// Redirect the user
window.location.href = linkURL;
});
}
</script>
<script type="text/javascript">
$(function () {
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
esseyId = e.relatedTarget.id;
mainuserid = $(e.relatedTarget).data('data-mainuserid');
fdescription = $(e.relatedTarget).data('data-fdescription');
$('input[name="data-id"]', $modal).val(esseyId); // SEND VALUE OF ID TO HIDDEN FIELD ID
$('input[name="data-mainuserid"]', $modal).val(mainuserid); // SEND VALUE OF MAINUSERID
$('input[name="data-fdescription"]', $modal).val(fdescription); // SEND VALUE OF DESCRIPTION
$modal.find('.edit-content').html(esseyId);
});
});
</script>
</body>
</html>
<!-- Recordset include close -->
var val = $('element').data('ID');
Note we do not pass data-ID to the function - only the name part.$('input[name="data-id"]', $modal).val(esseyId); // SEND VALUE OF ID TO HIDDEN FIELD ID
$('input[name="data-mainuserid"]', $modal).val(mainuserid); // SEND VALUE OF MAINUSERID
$('input[name="data-fdescription"]', $modal).val(fdescription); // SEND VALUE OF DESCRIPTION
There is no relationship between the data attributes and the name of the control. In your code the controls are named 'id', 'mainuserid' and 'fdescription' so you need to use those names in your jQuery above
$('input[name="id"]', $modal).val(esseyId); // SEND VALUE OF ID TO HIDDEN FIELD ID
$('input[name="mainuserid"]', $modal).val(mainuserid); // SEND VALUE OF MAINUSERID
$('input[name="fdescription"]', $modal).val(fdescription); // SEND VALUE OF DESCRIPTION
That sorts out the setting of your values (mostly).data-id="<%=(rs_forms.Fields.Item("id").Value)%>"
This is the hidden field that captures the value:
<input type="hidden" id = "idfield" name ="idfield" >
<script type="text/javascript">
$(function () {
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
esseyId = e.relatedTarget.id;
mainuserid = $(e.relatedTarget).data('mainuserid');
fdescription = $(e.relatedTarget).data('fdescription');
$('input[name="idfield"]', $modal).val(esseyId); // SEND VALUE OF ID TO HIDDEN FIELD ID
console.log('[' + mainuserid + ']');
$('#mainuserid').val(mainuserid);
// $('#mainuserid').val(mainuserid); // SEND VALUE OF MAINUSERID
// $('#mainuserid option[value="'+ mainuserid +'"]', $modal).prop('selected', true); // SEND VALUE OF MAINUSERID
$('input[name="fdescription"]', $modal).val(fdescription); // SEND VALUE OF DESCRIPTION
$modal.find('.edit-content').html(esseyId);
});
});
</script>
I get the mainuserid and the fdescription but not the idfield value, that one is blank.
<script type="text/javascript">
$(function () {
$('#edit-modal').on('show.bs.modal', function(e) {
var $modal = $(this),
esseyId = $(e.relatedTarget).data('id'),
mainuserid = $(e.relatedTarget).data('mainuserid'),
fdescription = $(e.relatedTarget).data('fdescription');
$('input[name="idfield"]', $modal).val(esseyId); // SEND VALUE OF ID TO HIDDEN FIELD ID
$('input[name="mainuserid"]', $modal).val(mainuserid); // SEND VALUE OF MAINUSERID
$('input[name="fdescription"]', $modal).val(fdescription); // SEND VALUE OF DESCRIPTION
$modal.find('.edit-content').html(esseyId);
});
});
</script>
This is server side code
Open in new window
JQuery is client side
a) Where does the value come from initially
b) How do you want to use the value - does it get sent as part of a form - is there a reason you can't use a hidden input to store the value.