Blancer.com Tutorials and projects
Freelance Projects, Design and Programming Tutorials
Category Added in a WPeMatico Campaign
My javascript object is returning values in the below format and I am trying to copy those values in the different objects but am not able to.
instead of value, it returns f c()
Accountid value is “1eeaa9a3-cd2a-43b2-a727-37f5acbcb7ac” but I am getting f c()
I have an application in NestJS, when a request is made to create an object, it validates that an object with the same name and some other parameters does not exist, in those validations the process takes approximately 30 seconds, before actually being saved.
But when from the angular front several requests are made by pressing the “create” button many times, and the process of the first one has not been completed, all the requests pass because the name does not yet exist for the system since the object is not yet saved with this name. In the end the objects end up being saved duplicates.
I know it can be avoided by disabling the “create” button from front until a response is obtained.
But my task from the back is to also prevent this error, I can think of a set.timeout in receiving the request, but I am not sure, more than anything, only allow a request every “x” time only for each user.
Any idea, I have something like this extract on my code:
async createRole(role: RoleDto, permissions) {
const { Name, Account } = role;
if (!Name)
throw new UnprocessableEntityException(
'The Name must be provided.',
);
if (!Account)
throw new UnprocessableEntityException(
'The Account must be provided.',
);
const roleExist = await this.rolesRepository.findOne({
where: { Name, Account },
});
if (roleExist)
throw new ConflictException(
'Name has been already used on this corporation.',
);
var roleToSave = new Role();
roleToSave.Name = Name;
roleToSave.Account = Account;
roleToSave = await this.rolesRepository.save(roleToSave);
I need some reactivity in vanila js. I solved the problem but ran into a problem. Simple example:
Why does it work correctly:
let data = {
'test': ()=>"some value"
}
$.ajax({
url: "/api/test",
dataType: "json",
type: 'post',
data: data,
success: function(data){
}});
and it doesn’t work:
let data = {}
Object.defineProperty(data,'test', {
get: () => "some test value"
}
$.ajax({
url: "/api/test",
dataType: "json",
type: 'post',
data: data,
success: function(data){
}});
}
I have created two lists on Redis database I intend to read data from them using lPop and insert using rPush. I am using Node-Redis driver to connect to Redis and do operations below is my code
const redis = require('redis');
const https = require('https')
const client = redis.createClient({
host: 'host',
port: 6379,
password: 'pwd'
});
const main = async() => {
console.log('starting app..');
client.on('error', err => {
console.log('Error ' + err);
return;
});
await client.connect();
client.lPop('Response',(err,msg) => {
console.log('Received on Response :' + msg); // 'message'
});
// this is for testing purpose
const testMsg = {
"id": "77777",
"operation": "create_acc",
"success": "true",
"explorerUrl": "url"
};
await client.rPush('Response',JSON.stringify(testMsg));
}I setup the callback on lPop and then pushing data using rPop at the bottom . I am able to receive this data using redid-cli commands but not using the code above. That is when at the bottom part rPush pushes the data which is received on CLI using LPOP command but in above code the lPop callbacks aren’t working
Please suggest whats missing.
I wrote a renderer of sorts that can create Signed Distance Fields in Javascript / Canvas
https://jsfiddle.net/MisterSirCode/zrbx8493/273/
It works well, but the SDFs it renders, while accurate, are rough and pixelated
(Im calculating each pixel manually and applying the color data based on the X Y position / distance and then editing the image data of the canvas)
This is less than what I want to achieve. I want the rendered SDFs to have an anti-aliased appearance, but I’ve never made an algorithm to achieve it, and I’ve found little online that could help me.
What I want to know is, how can I correctly alias the corners and edges of my SDFs to give them a smoother appearance from far away.
This is the main function I draw my SDFs onto the image data with: (The full source code is in the above link)
draw() {
let image = this.ctx.createImageData(this.image);
let ivec = new Vector(image.width, image.height);
for (var y = 0; y < image.height; ++y) {
for (var x = 0; x < image.width; ++x) {
let sphereOne = SDF.sphere(new Vector(ivec.x / 2, ivec.y / 2), 25)(new Vector(x, y, 1));
let sphereTwo = SDF.sphere(new Vector(ivec.x / 4, ivec.y / 4), 15)(new Vector(x, y, 1));
let dist = SDF.smoothAdd(sphereOne, sphereTwo, 35);
let pos = (y * image.width + x) * 4;
if (dist < 0) {
image.data[pos++] = x / image.width * 255;
image.data[pos++] = y / image.height * 255;
image.data[pos++] = (image.width - x) / image.width * 255;
image.data[pos] = 255;
} else {
let bc = this.scene.backColor;
image.data[pos++] = bc[0] * 255;
image.data[pos++] = bc[1] * 255;
image.data[pos++] = bc[2] * 255;
image.data[pos] = bc[3] * 255;
}
}
}
this.ctx.putImageData(image, 0, 0);
}
I’m dealing with some chart data issues
I want to generate from this
[
{date: '17:18:21', throughput_series: '149.28'},
{date: '17:18:31', throughput_series: '168.25'},
{date: '17:18:21', avg_response_time_series: '111.04'},
{date: '17:18:31', avg_response_time_series: '155.39'},
{date: '17:18:21', max_active_user_series: '297.42'}
{date: '17:18:31', max_active_user_series: '174.41'}
]
to this:
[
{date: '17:18:21', throughput_series: '149.28', avg_response_time_series: '111.04', max_active_user_series: '297.42'},
{date: '17:18:31', throughput_series: '168.25', avg_response_time_series: '155.39', max_active_user_series: '174.41'},
]
How can I extract into the same object with a given date?
Thanks for any help.
New to Javascript/Chrome extensions.
I’m looking to create a test extension that would capture the HTML/Content of the tabs for the Browser. It would be cool if the test could filter off the “URL” as well.
I’ve been looking over different test apps, and I’ve managed to get the Cookies, but can’t see how to get the content.
I’ve looked over the Chrome/Mozilla stores with no luck.
Pointers are appreciated.
thanks
I’m trying to add select2 for a dynamic form which is a modelformset_factory, but it doesnt work as i expect, it only works after the first add new row button! and after the third forms it create an extra drop down field!
here is what im tried
const addNewRow = document.getElementById('add-more-invoice')
const totalNewForms = document.getElementById('id_imei-TOTAL_FORMS')
addNewRow.addEventListener('click',add_new_row);
function add_new_row(e){
if(e){
e.preventDefault();
}
const currentFormClass = document.getElementsByClassName('child_imeiforms_row')
const countForms = currentFormClass.length
const formCopyTarget = document.getElementById('form-imeilists')
const empty_form = document.getElementById('empty-imei-invoiceform').cloneNode(true);
empty_form.setAttribute('class','child_imeiforms_row')
empty_form.setAttribute('id',`form-${countForms}`)
const rgx = new RegExp('__prefix__','g')
empty_form.innerHTML = empty_form.innerHTML.replace(rgx,countForms)
totalNewForms.setAttribute('value',countForms + 1)
formCopyTarget.append(empty_form)
$('.choose').select2();
}
$('.choose').select2(); <form action="" method="POST" id="create-permcustomer-invoice">{% csrf_token %}
<div class="row">
<div class="col-md-6">
<div class="form-group">
<i class="fas fa-file-signature"></i>
<label>customer name</label>
{{ main_form.customer | add_class:'form-control' | append_attr:'onchange:currentBalance();' }}
</div>
</div>
<div class="col-md-2">
<div class="form-group">
<i class="fas fa-box-usd"></i>
<label>balance</label>
<input type="number" disabled class="form-control" id="balance_cus">
</div>
<!-- /.form-group -->
</div>
<!-- /.col -->
<div class="col-md-4 pull-right">
<div class="form-group">
<i class="far fa-clock"></i>
<label>date</label>
{{main_form.created | add_class:'form-control text-center'}}
</div>
</div>
</div>
{{imei_forms.management_form}}
<div id="form-imeilists">
{% for imei in imei_forms %}
{{imei.id}}
<div class="child_imeiforms_row">
<div class="row no-gutters table-bordered">
<div class="col-md-3">
<div class="form-group">
{{imei.item | add_class:'form-control choose' | append_attr:'onchange:imeiPlusInfo();'}}
<div class="text-danger text-center" hidden></div>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
{{imei.price | add_class:'price'}}
</div>
</div>
<div class="col-md-1">
<div class="form-group">
<input step="any" type="number" onkeyup="totalSum()" class="form-control loan" disabled placeholder="loan">
</div>
</div>
</div>
</div>
{% endfor %}
</div>
<div id="empty-imei-invoiceform" class="hidden">
<div class="row no-gutters table-bordered">
<div class="col-md-3">
<div class="form-group">
{{imei_forms.empty_form.item | add_class:'form-control choose' | append_attr:'onchange:imeiInfo();'}}
<div class="text-danger text-center" hidden></div>
</div>
</div>
<div class="col-md-2">
<div class="form-group">
{{imei_forms.empty_form.price | add_class:'price'}}
<div class="text-danger text-center" hidden></div>
</div>
</div>
<div class="col-md-1">
<div class="form-group">
<input step="any" type="number" onkeyup="totalSum()" class="form-control loan" disabled placeholder="loan">
</div>
</div>
</div>
</div>
<button type="button" class="btn btn-lg btn-info" id="add-more-invoice">add new row</button>
<div class="card-footer">
<div class="row justify-content-center">
<button type="submit" class="btn btn-lg btn-success">save</button>
</div>
</div>
</form>but doesnt work as i expected ! is there any solution please ?thank you in advance ..
I am doing a customer information scanner project for school, currently I am working on the phone number portion. I need to have the customer enter their phone number and I need to detect as many errors as possible.
This includes: make sure it’s all digits, make sure its ten digits, then to divide into – <3 digit String for Area Code> <3 digit String for Central Office > <4 digit String for Station Code> and finally add dashes between the area code, central office, and station code. Are there any easy ways to do this, here is my current code. Thanks in advance
enter code here//===================================================================================================================================
System.out.println(DATA_DIV);
System.out.println("nCustomer Phone Number Information");
System.out.println("-----------------------------------n");
System.out.println("Enter the Phone Number:");
phoneNumber = uIn.next();
if (phoneNumber.matches("\d+")) {
} else {
Garbage = uIn.next();
System.out.println("ntError Data Type: you entered ( " + Garbage + " ) for Phone Number");
System.out.println("Phone Number must be made up of numbers only");
System.out.println();
System.out.println("Re-Enter the Phone Number :");
phoneNumber = uIn.next();
}
In my Phaser game, I want to use a cell-like background texture which moves when you move.
My idea was to add each cell in a for loop like this:
let width=100, height=100;
for(let y=0;y<width;y++){
;
for(let x=0; x<height;x++){
this.physics.add.image(width/2+64*x, height/2+64*y, "snow_field").setScale(4,4);
}
}
The problem: The game gets very (very) slow
So is there a better / recommended way to add repeating images/backgrounds?
I’m developing a chat app using react-native, node, mongoose, socket.io, the problem is, when using socket.io, when I send message from user1 to user2, I’m able to receive the sent message from user1 but the useEffect doesn’t re-renders the component to add the new message into the array of messages even though I have entered the correct dependencies. Below is the code for reference:
This is my MessageScreen & I have defined socket outside the scope of functional component MessageScreen:
const socket = io('ws://192.168.29.123:8080', {
transports: ['websocket'],
}); // declared outside the functional component
const [arrivalMessage, setArrivalMessage] = useState(null);
useEffect(() => {
socket.on('getMessage', data => {
console.log('received: ',data);
setArrivalMessage({
matchId: matchId,
senderId: data.senderId,
text: data.text,
createdAt: Date.now(),
updatedAt: Date.now(),
});
});
console.log('arrival msg: ',arrivalMessage);
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [arrivalMessage, socket]);
useEffect(() => {
// ensures we don't get anyother user's msg
arrivalMessage &&
match.includes(arrivalMessage.senderId) &&
setMessages((prev) => [...prev, arrivalMessage]);
}, [arrivalMessage, match]);
useEffect(() => {
socket.emit('addUser', uid);
}, [uid]);
Although I’m receiving the correct data from my friend but the state is not updating & therefore I’m not able to display real-time messages.
So, whenever I send a message from 1 user to another, this is my console output which confirms that I am able to receive the message from that user & obviously the title error:
LOG received: {"senderId": "61b5d1725a7ae2994", "text": {"matchId":"61b5d172511867ae298c", "senderId": "61b5d1725a7ae2994", "text": "me too!"}}
ERROR Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in a useEffect cleanup function. in MessageScreen (at SceneView.tsx:126)
LOG received: {"senderId": "61b5d1725a7ae2994", "text":{"matchId":"61b5d111867ae298c","senderId":"61b5d1725a7ae2994", "text": "me too!"}}
It would be really helpful if someone could point out what is wrong here!
Thank you!
I started using react-native-web, and trying to do so with typescript. So far not much success. According this question, if I create a .d.ts file, typescript will get the types from there, but the values will be get from the not .d.ts files.
For me it throws 'Icon' only refers to a type, but is being used as a value here..
I’m using it in a file called Spinner.tsx, importing it like: import { Icon } from '../Icon';, my file structure looks like:
Icon
index.native.tsx
index.web.tsx
index.d.ts
index.native.tsx:
import React, { FC } from 'react';
import { ViewStyle } from 'react-native';
import RNVIcon from 'react-native-vector-icons/Ionicons';
import { IconProps } from './index.web';
export const Icon: FC<Omit<IconProps, 'style'> & { style: ViewStyle }> = ({ name, ...props }) => {
const RNVIName = name
.replace(/io/i, '')
.replace(/[A-Z][a-z]*/g, (str) => '-' + str.toLowerCase() + '-')
.replace(/--/g, '-')
.replace(/(^-)|(-$)/g, '');
return <RNVIcon name={RNVIName} {...props} />
};
index.web.tsx:
import React, { CSSProperties, FC } from 'react';
import * as Icons from 'react-icons/io5';
import { ViewStyle } from 'react-native';
export type IconProps = {
name: keyof typeof Icons;
size?: number;
color?: string;
style?: ViewStyle;
}
export const Icon: FC<Omit<IconProps, 'style'> & { style: CSSProperties }> = ({ name, ...props }) => {
const Component = Icons[name];
return <Component {...props} />
}
index.d.ts:
import { FC } from "react";
import { IconProps } from "./index.web";
export type Icon = FC<IconProps>
I have tried with default export as well, no success. What am I doing wrong?
I’m currently learning about importing data from an api and I’ve been trying to get some images from Nasa.
I had luck with the Picture of the Day,
const apodImg = async () => {
//importing the picture
const header = { headers: { Accept: "application/json" } };
const res = await axios.get(
"https://api.nasa.gov/planetary/apod?api_key=LXzoeDP12bLimV0TdOVjJeI2uQa1TXAHmVtdkky1",
header
);
console.log(res.data.hdurl);
//output on webpage
const img = document.querySelector("#apod");
img.src = res.data.url;
};
apodImg();
but not with getting images or just an image from the Mars project. The image is too nested in objects and arrays for me to know how to target it.
I took this api address to the webapp Postman and received the following data.
https://api.nasa.gov/mars-photos/api/v1/rovers/curiosity/photos?earth_date=2015-6-3&api_key=LXzoeDP12bLimV0TdOVjJeI2uQa1TXAHmVtdkky1
{ "photos": [
{
"id": 102685,
"sol": 1004,
"camera": {
"id": 20,
"name": "FHAZ",
"rover_id": 5,
"full_name": "Front Hazard Avoidance Camera"
},
"img_src": "http://mars.jpl.nasa.gov/msl-raw-images/proj/msl/redops/ods/surface/sol/01004/opgs/edr/fcam/FLB_486615455EDR_F0481570FHAZ00323M_.JPG",
"earth_date": "2015-06-03",
"rover": {
"id": 5,
"name": "Curiosity",
"landing_date": "2012-08-06",
"launch_date": "2011-11-26",
"status": "active"
}
}
I tried to target the img_src but I doubting that the underscore ‘_’ is legit in JavaScript. Anyway it’s not working for me. I’m getting this error in the console (Chrome):
nasa.js:23 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'img_src') at marsImg
Can someone guide me onwards. Thanks in advance!
I am using Datatable’s ServerSide, in which I need to put a modal for the “update” option but it does not execute the function to obtain the data, the data through the serverside if I bring it but the update I do not retrieve.
function consultar(){
$(document).ready(function() {
$('#tableMatPrima').DataTable( {
"processing": true,
"serverSide": true,
"ajax": "serverSideentradas.php",
"lengthMenu": [[15, 30, 45], [15, 30, 45]],
"order": [3, 'desc'],
"searching": true,
"bDestroy": true,
"columnDefs":[
{
"targets": [1, 2, 3, 4],
"className": 'dt-body-center'
},
{
"targets": 4,
"render": function(data, type, row, meta){
const cve_entrada = data;
return '<span class= "btn btn-warning" onclick= "obtenerDatos(cve_entrada)" data-toggle="modal" data-target="#modalMatPrimaUpdate" data-whatever="@getbootstrap"><i class="fas fa-edit"></i> </span>'
}
}
],
"language": {
"lengthMenu": "Mostrar _MENU_ registros por página.",
"zeroRecords": "No se encontró registro.",
"info": " _START_ de _END_ (_TOTAL_ registros totales).",
"infoEmpty": "0 de 0 de 0 registros",
"infoFiltered": "(Encontrado de _MAX_ registros)",
"search": "Buscar: ",
"processing": "Procesando...",
"paginate": {
"first": "Primero",
"previous": "Anterior",
"next": "Siguiente",
"last": "Último"
}
}
} );
} );
}
function obtenerDatos(cve_entrada) {
$.getJSON("modelo_entradas.php?consultar="+cve_entrada, function(registros){
$('#comb_idu').val(registros[0]['cve_entrada']);
$('#comb_mat_primau').val(registros[0]['nombre']);
$('#comb_cantidadu').val(registros[0]['cantidad_entrada']);
});
}I have made a request form for my group to make it easier for them to request for help desk. At the moment I have two dropdowns – I have the main request dropdown when the user selects from the first dropdown selection it goes to the second dropdown selection for the user to select. I want to add the third dropdown so when the user selects from the second dropdown it opens more selection in the third dropdown based on what category the user has selected for the Second dropdown.
Also since all of us no the Internet Explorer is going to get decommission so i have web pages that run on IE, but i want them to force open them in Edge, i have written the code that works but it opens the Edge and the IE pages but i want to keep only the Edge webpage and close the IE page
The Edge code is very top on the page
$(function() {
// on page load wrap all select-2 options in span so they cannot be selected without specifying select-1
$('#select-2 option:not([selected])').wrap('<span/>');
});
// when select-1 is changed, hide all options that do not have the class corresponding to the value of select-1
$('#select-1').change(function() {
$('#select-2 span > option').unwrap();
console.log($('#select-1'));
$('#select-2 option:not(.' + $('#select-1').val() + ', [selected])').wrap('<span/>');
//console.log($('#select-2').val());
});
$('#select-2').trigger('change');
$(document).ready(function() {
$("#otherFieldGroupMod").hide();
$("#otherFieldGroupRes").hide();
$("#otherFieldGroupRem").hide();
$("#otherFieldGroupOutacc").hide();
$("#outlookAccountDistri").hide();
$("#otherFieldGroupWinacc").hide();
$("#otherFieldGroupKdrive").hide();
$("#otherFieldGroupDcnet").hide();
$("#otherFieldGroupResPass").hide();
$("#otherFieldGroupValpo").hide()
});
//AS400 NEW ACCOUNT SCRIPT//
$(function() {
$("#select-2").change(function() {
if ($(this).val() == "AS400 New Account") { //AS400 New Account //
$("#otherFieldGroupNewacc").show();
$('#otherFieldGroupNewacc').attr('required','');
} else {
$("#otherFieldGroupNewacc").hide();
$('#otherFieldGroupNewacc').removeAttr('required');
}
if ($(this).val() == "Modify Account") { //AS400 Modify Account //
$("#otherFieldGroupMod").show();
} else {
$("#otherFieldGroupMod").hide();
}
if ($(this).val() == "Reset Password") { //AS400 Reinstate Account //
$("#otherFieldGroupRes").show();
} else {
$("#otherFieldGroupRes").hide();
}
if ($(this).val() == "Remove Password") { //AS400 Remove Account //
$("#otherFieldGroupRem").show();
} else {
$("#otherFieldGroupRem").hide();
}
if ($(this).val() == "Outlook New Account") { //Outlook New Account//
$("#otherFieldGroupOutacc").show();
} else {
$("#otherFieldGroupOutacc").hide();
}
if ($(this).val() == "Add to Distribution List") { //Outlook Add to Distribution List//
$("#outlookAccountDistri").show();
} else {
$("#outlookAccountDistri").hide();
}
if ($(this).val() == "Windows New Account") { //Windows New Account//
$("#otherFieldGroupWinacc").show();
} else {
$("#otherFieldGroupWinacc").hide();
}
if ($(this).val() == "K Drive and Group Access") { //Windows K Drive and Group Access//
$("#otherFieldGroupKdrive").show();
} else {
$("#otherFieldGroupKdrive").hide();
}
if ($(this).val() == "DC Net") { //Windows DC Net Access//
$("#otherFieldGroupDcnet").show();
} else {
$("#otherFieldGroupDcnet").hide();
}
if ($(this).val() == "Password Reset") { //Windows Reset Password//
$("#otherFieldGroupResPass").show()
&& $("#userEmail").hide()
&& $(".btn-submit").hide();
} else {
$("#otherFieldGroupResPass").hide()
&& $("#userEmail").show()
&& $(".btn-submit").show();
}
if ($(this).val() == "Valpo New Account") { //New Valpo Access//
$("#otherFieldGroupValpo").show();
} else {
$("#otherFieldGroupValpo").hide();
}
});
});
$(function() {
// on page load wrap all select-2 options in span so they cannot be selected without specifying select-1
$('#select-4 option:not([selected])').wrap('<span/>');
});
// when select-1 is changed, hide all options that do not have the class corresponding to the value of select-1
$('#select-3').change(function() {
$('#select-4 span > option').unwrap();
$('#select-4 option:not(.' + $('#select-3').val() + ', [selected])').wrap('<span/>');
//console.log($('#select-2').val());
});
$('#select-4').trigger('change');<script>
if(/MSIE d|Trident.*rv:/.test(navigator.userAgent)) {
window.location = 'microsoft-edge:' + 'http://www.walmart.com';
setTimeout(function() {
//window.location = 'https://go.microsoft.com';
}, 1);
}
</script>
<!DOCTYPE html>
<html>
<head>
<title>ID Request Form</title>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<link href="contact-view.css" rel="stylesheet">
</head>
<body>
<div class="testbox">
<form name="frmContact" id="frmContact" method="post" action="" enctype="multipart/form-data" class="p-3">
<div class="banner">
<h1>                ID Request Form</h1>
</div>
<br>
<p>Please fill out with the information that is requested below and submit the id request form. Thank you!</p>
<div class="form-group">
<label>Request Type</label>
<select id="select-1" name="select-1" class="form-control w-100" required>
<option selected value="">--Select an option--</option>
<option value="AS400">AS400</option> <!-- "option-1" -->
<option value="Outlook">Outlook</option> <!-- "option-2" -->
<option value="Windows">Windows</option> <!-- "option-3" -->
<option value="Valpo">Valpo</option> <!-- "option-4" -->
</select>
<br/>
<label>Choose a Sub-Category</label>
<select id="select-2" name="select-2" class="form-control w-100" required>
<option selected value="">--Select an option--</option>
<option value="AS400 New Account" class="AS400">AS400 New Account</option> <!-- "option-1a" -->
<option value="Modify Account" class="AS400">Modify Account</option> <!-- "option-1b" -->
<option value="Reset Password" class="AS400">Reset Password</option> <!-- "option-1c" -->
<option value="Remove Password" class="AS400">Remove Account</option> <!-- "option-1d" -->
<option value="Outlook New Account" class="Outlook">Outlook New Account</option> <!-- "option-2a" -->
<option value="Add to Distribution List" class="Outlook">Add to Distribution List</option> <!-- "option-2b" -->
<option value="Windows New Account" class="Windows">Windows New Account</option> <!-- "option-3a" -->
<option value="K Drive and Group Access" class="Windows">K Drive and Group Access</option> <!-- "option-3b" -->
<option value="DC Net" class="Windows">DC Net</option> <!-- "option-3c" -->
<option value="Password Reset" class="Windows">Password Reset</option> <!-- "option-3d" -->
<option value="Valpo New Account" class="Valpo">Valpo New Account</option> <!-- "option-4a" -->
</select>
</div>
<hr>
>
<!--AS400 New Account-->
<div class="form-group" id="otherFieldGroupNewacc">
<h2>AS400 New Account</h2><hr>
<div class="row">
<div class="col-6">
<label for="userRequestor">Full Name</label>
<input type="text" class="form-control w-100" id="userRequestor" name="userRequestor" placeholder="Type Here..." value="<?php if(isset($_SESSION['data']['Requestor Name'])) echo $_SESSION['data']['Requestor Name']; ?>">
</div>
<br><br>
<div class="col-6">
<label for="userTM">Beneficiary (Full Name)</label>
<input type="text" class="form-control w-100" id="userTM" name="userTM"placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmployee">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmployee" name="userEmployee" placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label for="selectJob">New Job Category</label>
<select id="selectJob" name="selectJob" class="form-control w-100" placeholder="*Click in box for Job Category List*">
<option disabled selected value="">Select an option</option>
<option value="NO CHANGE">NO CHANGE</option>
<option value="ADMCLK = Admin Clerk">ADMCLK = Admin Clerk</option>
<option value="ADMCLK+ = Admin Clerk w/ Manual Book">ADMCLK+ = Admin Clerk w/ Manual Book</option>
<option value="ADMMGR = Admin MGR w/ Manual Book">ADMMGR = Admin MGR w/ Manual Book</option>
</select>
</div>
<br>
<div class="col-6">
<label for="userNewAS400">New AS400 ID</label>
<input type="text" class="form-control w-100" id="userNewAS400" name="userNewAS400" placeholder="Type Here...">
</div>
</div>
</div>
<!--Modify AS400 Account-->
<div class="form-group" id="otherFieldGroupMod">
<h2>AS400 Modify Account</h2><hr>
<div class="row">
<div class="col-6">
<label for="userRequestorMod">Requester (Full Name)</label>
<input type="text" class="form-control w-100" id="userRequestorMod" name="userRequestorMod"placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userTMMod">Beneficiary (Full Name)</label>
<input type="text" class="form-control w-100" id="userTMMod" name="userTMMod" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmployeeMod">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmployeeMod" name="userEmployeeMod" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userAS400Mod">AS400 ID</label>
<input type="text" class="form-control w-100" id="userAS400Mod" name="userAS400Mod" placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label for="selectJobsMod">New Job Category</label>
<select id="selectJobsMod" name="selectJobsMod" class="form-control w-100" placeholder="*Click in box for Job Category List*">
<option disabled selected value="">Select an option</option>
<option value="NO CHANGE">NO CHANGE</option>
<option value="ADMCLK = Admin Clerk">ADMCLK = Admin Clerk</option>
<option value="ADMCLK+ = Admin Clerk w/ Manual Book">ADMCLK+ = Admin Clerk w/ Manual Book</option>
<option value="ADMMGR = Admin MGR w/ Manual Book">ADMMGR = Admin MGR w/ Manual Book</option>
</select>
</div>
<br>
<div class="col-6">
<label for="userNewAS400Mod">New AS400 ID <strong>***Leave Blank If No Change***</strong></label>
<input type="text" class="form-control w-100" id="userNewAS400Mod" name="userNewAS400Mod" placeholder="Type Here...">
</div>
</div>
</div>
<!--Reinstate AS400 Account-->
<div class="form-group" id="otherFieldGroupRes">
<h2>AS400 Reinstate Password</h2><hr>
<div class="row">
<div class="col-6">
<label for="userRequestorRe">Requester (Full Name)</label>
<input type="text" class="form-control w-100" id="userRequestorRe" name="userRequestorRe"placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userTMRe">Beneficiary (Full Name)</label>
<input type="text" class="form-control w-100" id="userTMRe" name="userTMRe" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmployeeRe">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmployeeRe" name="userEmployeeRe" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userAS400Re">AS400 ID</label>
<input type="text" class="form-control w-100" id="userAS400Re" name="userAS400Re" placeholder="Type Here...">
</div>
</div>
</div>
<!--Remove AS400 Account-->
<div class="form-group" id="otherFieldGroupRem">
<h2>AS400 Remove Account</h2><hr>
<div class="row">
<div class="col-6">
<label for="userRequestorRes">Requester (Full Name)</label>
<input type="text" class="form-control w-100" id="userRequestorRes" name="userRequestorRes"placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label for="userTMRes">Terminated TM (Full Name)</label>
<input type="text" class="form-control w-100" id="userTMRes" name="userTMRes" placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label for="userEmployeeRes">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmployeeRes" name="userEmployeeRes" placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label for="userAS400Res">AS400 ID</label>
<input type="text" class="form-control w-100" id="userAS400Res" name="userAS400Res" placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label for="hideInputRes">Reason</label>
<input type="text" class="form-control w-100" id="hideInputRes" name="hideInputRes" title="Example: Fired, Retired, Leave of Absence, etc..." placeholder="Type Here...">
</div>
</div>
</div>
<!--New Account-->
<div class="form-group" id="otherFieldGroupOutacc">
<h2>Outlook New Account</h2><hr>
<div class="row">
<div class="col-6">
<label for="userReqNewOutlook">Full Name</label>
<input type="text" class="form-control w-100" id="userReqNewOutlook" name="userReqNewOutlook" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmpNewOutlook">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmpNewOutlook" name="userEmpNewOutlook" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="oneIDNewOutlook">ONE ID (Formally Authenticator ID)</label>
<input type="text" class="form-control w-100" id="oneIDNewOutlook" name="oneIDNewOutlook" placeholder="Type Here...">
</div>
<br><br>
</div>
</div>
<!--Add to Distribution List-->
<div class="form-group" id="outlookAccountDistri">
<h2>Add to Distribution List</h2><hr>
<div class="row">
<div class="col-6">
<label for="userReqOutlookDist">Full Name</label>
<input type="text" class="form-control w-100" id="userReqOutlookDist" name="userReqOutlookDist" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="oneIDOutlookDist">ONE ID (Formally Authenticator ID)</label>
<input type="text" class="form-control w-100" id="oneIDOutlookDist" name="oneIDOutlookDist" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="select-5">Select a Distribution List</label>
<select id="select-5" name="select-5" class="form-control w-100" placeholder="*Click in box for Distribution List*">
<option disabled selected value="">Choose a Distribution List</option>
<option value="WoodlandDInsuffAitems">WoodlandDInsuffAitems</option>
</select>
</div>
</div>
</div>
<!--Windows New Account-->
<div class="form-group" id="otherFieldGroupWinacc">
<h2>Windows New Account</h2><hr>
<div class="row">
<div class="col-6">
<label for="userReqWinAcnt">Full Name</label>
<input type="text" class="form-control w-100" id="userReqWinAcnt" name="userReqWinAcnt" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmpWinAcnt">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmpWinAcnt" name="userEmpWinAcnt" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="oneIDWinAcnt">ONE ID (Formally Authenticator ID)</label>
<input type="text" class="form-control w-100" id="oneIDWinAcnt" name="oneIDWinAcnt" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userMirror"> Mirror Account ONE ID</label>
<input type="text" class="form-control w-100" id="userMirror" name="userMirror" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userComment">Comments</label>
<input type="text" class="form-control w-100" id="userComment" name="userComment" placeholder="Type Here...">
</div>
</div>
</div>
<!--K Drive and Group Access-->
<div class="form-group" id="otherFieldGroupKdrive">
<h2>K Drive and Group Access</h2><hr>
<div class="row">
<div class="col-6">
<label for="userReqDrive">Full Name</label>
<input type="text" class="form-control w-100" id="userReqDrive" name="userReqDrive" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmpDrive">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmpDrive" name="userEmpDrive" placeholder="Type Here...">
</div>
</div>
</div>
<!--DC Net Access-->
<div class="form-group" id="otherFieldGroupDcnet">
<h2>DC Net Access</h2><hr>
<div class="row">
<div class="col-6">
<label for="userReqDCNET">Full Name</label>
<input type="text" class="form-control w-100" id="userReqDCNET " name="userReqDCNET" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="userEmpDCNET">Employee ID</label>
<input type="text" class="form-control w-100" id="userEmpDCNET" name="userEmpDCNET" placeholder="Type Here...">
</div>
<br><br>
<div class="col-6">
<label for="oneIDDCNET">ONE ID (Formally Authenticator ID)</label>
<input type="text" class="form-control w-100" id="oneIDDCNET" name="oneIDDCNET" placeholder="Type Here...">
</div>
<br>
<div class="col-6">
<label>Select your Job Title</label>
<select id="select-3" name="select-3" class="form-control w-100">
<option selected value="">Select an option</option>
<option value="TM">TM</option>
<option value="DCS">DCS</option>
</select>
<br>
<label>Select your Department & Shift</label>
<select id="select-4" name="select-4" class="form-control w-100">
<option selected value="">Select an option</option>
<option value="Cost Recovery" class="TM">Cost Recovery</option>
<option value="Lean Captain" class="TM">Lean Captain</option>
</select>
</div>
</div>
</div>
<!--Password Access-->
<div class="form-group" id="otherFieldGroupResPass">
<h2>Reset Windows Password</h2><hr>
<div class="col-6">
<label for="otherField11">Click the link for Reset Password Help</label>
<a href="http://wddc.walgreens.com/Forms/Password Resets & Account Unlocks for Direct Reports.pdf">Password Resets & Account Unlocks for Direct Reports</a>
</div>
</div>
<!---VALPO Account->
<!--New Account-->
<div class="form-group" id="otherFieldGroupValpo">
<h2>Valpo New Account</h2><hr>
<div class="row">
<div class="col-6">
<label for="userReqValpo">Full Name</label>
<input type="text" class="form-control w-100" id="userReqValpo" name="userReqValpo" placeholder="Type Here...">
</div>
<br><br>
</div>
</div>
<!--Sending Email-->
<div class="form-group" id="userEmail">
<div class="row">
<div class="col-6">
<label for="userEmail">Enter your Email</label>
<input type="text" class="form-control w-100" name="userEmail" placeholder="Type Here..." pattern="[email protected]" value="<?php if(isset($_SESSION['data']["Requestor's Email"])) echo $_SESSION['data']["Requestor's Email"]; ?>">
</div>
</div>
</div>
<div class="form-group" id="message">
<?php display_message(); ?>
</div>
<input type="submit" name="send" class="btn-submit" value="Send" />
</form>
</div>
<script src="hide-show-fields-form.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js"></script>
</body>
</html>